Impressions after The Rolling Scopes Conference 2019

Plan

Реалити шоу "Cкрам 2 - Построй свое приложение", или Сказ о том как мы всей командой тесты писали.
Svelte. Первый взгляд.
Don’t (re)write code. Let AST do it
What A Drag
Technical SEO for JS developers
How to set up a pipeline with visual unit tests for your application
Privacy UX
The Quest of the Styling Grail
Панельная дискуссия: Гайд по front-end разработчику, патч 2019
Строим PDP на основе гайдa по front-end

Реалити шоу "Cкрам 2 - Построй свое приложение", или Сказ о том как мы всей командой тесты писали

Irina Levina

Minsk, Belarus

Какие

unit - 1/3 функционала
интеграционные - важные связи
функциональные - на устоявшийся функционал

Советы

Тестируем старый функционал и популярные компоненты в первую очередь
Функциональные тесты - тестировщику
Искать методы борьбы с зависимостями
Snapshots тестирование это не хорошо
Screenshots тестирование это хорошо
Performance testing
Monkey testing

PageSpeed Insights

gremlins.js

Svelte. Первый взгляд.

Alexander Shushunov

Tver, Russia

for what need frameworks
(event-driven
vs
state-driven
development)

React:
state => VDOM => DOM

Svelte:
state => DOM

Svelte pros:

speed
bundle size
no runtime
lines of code
good for low-level devices
good for universal UIKit

bundle size:

lines of code:

todo app

Don’t (re)write code. Let AST do it

Nikita Sidorov

Nizhny Novgorod

Problem

Solving

Abstract
Syntax
Three

schematic

AST

example

result of syntax analysis

a simple example of code reformating

import { parse } from 'babylon';

const initialCode = 'const abc = 5';
const ast = parse(initialCode);

console.log(ast);

import { parse } from 'babylon';
import traverse from 'babel-traverse';
import generate from 'babel-generator';

const initialCode = 'const abc = 5';
const ast = parse(initialCode);

traverse(ast, {
  enter(path) {
    if (path.node.type === "Identifier") {
      path.node.name = path.node.name
        .split("")
        .reverse()
        .join("");
    }
  }
});

const newCode = generate(ast);

console.log(newCode);