Front-end дайджест #33: новинки Vue.js и React, чего ждать от нового Angular

В выпуске: разбираемся вместе с Эдди Османи, как загружается статика в Chrome, мир без TS-lint и чего нам ждать в новых версиях CSS.

CSS

Quick Tip: CSS Triangles — разбираемся с 4 способами сделать треугольник

Breaking Boxes With CSS Fragmentation

How @supports Works — как работает @support

Улучшаем наши интерфейсы при помощи CSS Grid, Flexbox и магических container units:

• Using CSS Grid the right way
• How to build a Mobile App Layout with CSS Flexbox
• Building Robust Layouts With Container Units

Mask Compositing: The Crash Course — учимся работать с масками

Recreating the Facebook Messenger Gradient Effect with CSS — добавляем градиенты в Messager

Разбираемся и применяем CSS переменные:

• Did you know that CSS Custom Properties can handle images too?
• Responsive Designs and CSS Custom Properties: Defining Variables and Breakpoints
• CSS Variables + calc() + rgb() = Enforcing High Contrast Colors

SVG Filter Effects:

• Creating Texture with <feTurbulence>
• Duotone Images with <feComponentTransfer>
• Conforming Text to Surface Texture with <feDisplacementMap>

JavaScript

An Introduction To WebBluetooth — разбираемся с Bluetooth API

How to Create a Fake 3D Image Effect with WebGL — играем с WebGL

Disallow large imports from JavaScript projects — Эдди Османи о баге в ESLint, позволяющем запретить некоторые импорты

JavaScript Loading Priorities in Chrome — Эдди Османи о расписании загрузок в Chrome

Why I Write CSS in JavaScript — Макс Стойбер о том, почему все-таки CSS in JS

Replacing a hot path in your app’s JavaScript with WebAssembly — как заменить самые горячие места в вашем приложении на WebAssembly

Node.js & JavaScript Testing Best Practices (2019) — как стоит тестировать в 2к19

12 Concepts That Will Level Up Your JavaScript Skills — фичи ES6, которые ты обязан использовать

ES5 to ESNext — here’s every feature added to JavaScript since 2015 — как изменился JavaScript за последние годы

React и React Native

Improving Performance in React Functional Components using React.memo() — начинаем использовать React.memo()

How the “Golden Rule” of React components can help you write better code

Advanced Redux Patterns: Selectors

React Hooks:

• React Hooks: Memoization
• Making Sense of React Hooks

Vue.js

Sliding In And Out Of Vue.js

Point of Vue   — Facing React

Creating Custom Directives in Vue.js

How to build a web app with Vue, Vuetify and Axios

Цикл статей Vue.js App Performance Optimization:

• Introduction to performance optimization and lazy loading
• Lazy loading routes and vendor bundle anti-pattern
• Lazy loading Vuex modules

Angular

Top 10 ways to use Interceptors in Angular

How to get the best performance out of your Angular apps

Redux, Angular Style: ngrx/store

Angular Reactive Forms: Tips and Tricks

Tooltip with Angular CDK

Библиотеки и Инструменты

Zero Server — тренд “Без конфигураций” добрался и до веб-серверов

Instant.page — ускоряем загрузку сайта

Pack — билдер NPM-пакетов

React Three Fiber — рендарим Three.js в React приложениях

Browser Preview for VS Code — которое можно дебажить

Послушать

Frontend Weekend:

• #86 — Александр Коротаев о том, как и зачем писать игры на JavaScript и выступать за рубежом
• #87 — Михаил Трошев о том, как эффективно руководить распределённой командой в Яндексе
• #88 — Что изменилось за год у Сергея Попова (о создании Лиги А и проблеме фронтендеров без опыта)

Веб-стандарты:

• Выпуск № 159
• Выпуск № 160
• Выпуск № 161
• Выпуск № 162
• Выпуск № 163

devschacht:

• 69: Я ❤ Frontend
• 70: Как TypeScript меняет наше мышление
• 71: Как TypeScript меняет наше мышление (часть 2)

Фронтенд Юность (18+):

• #83 Пересядь на звёздный стэк
• #84 Каждый из нас видал пострашнее
• #85 Всегда делай ставку на JavaScript
• #86 Том Дейл получил оскар за Росомаху с Дэном Абрамовым

CSSSR Новости 512:

• Выпуск № 37 (02.02 — 08.02)
• Выпуск № 38 (09.02 — 15.02)
• Выпуск № 39 (18.02 — 24.02)
• Выпуск № 40 (25.02 — 03.03)

RadioJS:

• Выпуск 54: Предновогодний. Svelte, Vue, новости и тренды
• Выпуск 55: Node.js на бэкенде — настоящий бэкенд?

Begebot:

• Выпуск № 5 — Великое разделение, трюки, фейлы Flow и Chromium


• Выпуск № 6 — media queries level 5, css doodle, чудо линтера в HH и плохой for
• Выпуск № 7 — Будущее js, PWA в Play Store и фронтенд за 100 дней

Proconf:

• ProConf #1 Highload 2018 ++
• ProConf #2 Frontend CON 2018
• ProConf #3 Build Stuff 2018

Посмотреть

CSS: FLIP-анимации

Node.js Crash Course — Node.js за 90 минут

Ember.js: The Documentary — документальный фильм про Ember.js

Что нового

IntersectionObserver в браузерах:

• IntersectionObserver in WebKit
• Trust is Good, Observation is Better—Intersection Observer v2

Спойлер. Новые функции в CSS

Storybook 5.0 (migration Guide)

Apollo Client 2.5

React v16.8

Vue 2.6 (обзор новинок)

Новый Angular — уже скоро

Ждем новый Chromium-based Edge

Остальное

State Of CSS 2019

Разработка под WebAssembly: реальные грабли и примеры

Where Do You Learn HTML & CSS in 2019?

TSLint in 2019 — TSLint, что дальше?

Better web video with AV1 codec — Злые Марсиане обозревают возможности нового видеокодека
Зачем нам нужны фреймворки и state-management-ы и чего ждать в будущем?

• Do we still need JavaScript frameworks?
• The future of JavaScript state management is less state management

Application Holotypes: A Guide to Architecture Decisions — выбираем правильную архитектуру для разных типов приложений
Рубрика — пишем приложения, которые будут нас радовать:

• How to write code you will love in the future
• 7 Stages of a “Clean” WebApp

Git History — смотреть git-историю стало красивее

Leon — персональный ассистент на JavaScript
16 марта пройдет конференция JavaScript fwdays’19. В этом году соберутся 800 участников, которых ждут 3 потока практических докладов от спикеров из Google, Microsoft, GitLab, Wix, Grammarly, Twilio, Kasta; Community stage, открытый микрофон и кинопросмотр на Afterparty. Среди спикеров: Martin Splitt, Christian Heilmann, Shmuela Jacobs, Вадим Макеев, Наталья Теплухина, Chris Gannon, Юрий Артюх, Илья Климов, Александр Соловьев и не только. Программа. Скидка 15% по промокоду: frontend-digest-dou.

Grammarly ищет талантливых Front-End инженеров для усовершенствования нашего продукта, создания минималистичных элегантных пользовательских интерфейсов и решения сложных технических задач. Нашим продуктом пользуются миллионы пользователей каждый день. У нас замечательная команда, вместе с которой мы используем самые передовые технологии. И если вам интересно стать частью её, то смотрите открытые вакансии здесь, или стучитесь ко мне в Facebook.

С вами был Григорий Шехет. За помощь в оформлении дайджеста благодарю своих коллег.

← Предыдущий выпуск: Frontend дайджест #32.
Следующий выпуск: Frontend дайджест #34 →

Все про українське ІТ в телеграмі — підписуйтеся на канал DOU