Front-end дайджест #36: New React Dev Tools і поліпшення продуктивності Instagram

У випуску: нативний лейзилоадин у новій версії Chrome, продовжуємо використовувати React Hook'і (чи зможуть вони замінити Redux?), а також як нові фічі в CSS допомагають жити краще.

Що нового

New React DevTools

V8 release v7.7

FireFox Team:

Chrome Team:

Deprecations and removals in Chrome 77
What's New In DevTools (Chrome 78)
The Native File System API: Simplifying access to local files — новий API для роботи з локальними файлами.

Native lazy-loading for the web — нативна лінива завантаження за допомогою атрибута loading в Chrome 76.

NodeGUI and React NodeGUI — пишемо десктопні програми на JavaScript на основі QT.

Can I email — таблиця доступності можливостей веб-платформи email движках.

CSS і CSS in JS

Overflow And Data Loss In CSS — будуємо адаптивну до контенту верстку, без втрат даних.

Using a PostCSS function to automate your responsive workflow — робимо CSS респонсив, використовуючи функцію rfs.

Logical Operations with CSS Variables — використання CSS-змінних на прикладі геометричних фігур.

Various Methods for Expanding a Box While Preserving the Border Radius — розбір методів збільшення розміру елемента при наведенні на нього.

CSS Security Vulnerabilities — як CSS може вплинути на безпеку вашого веб-додатки.

Can you rotate the cursor in CSS? — приклади обертання курсору.

Нові CSS властивості text-decoration-*:

Styling Links with Real Underlines — text-decoration;
text-decoration-skip-ink .

JavaScript

Using the DOM like a Pro — глибокий огляд використання різних DOM-методів.

Get started with GPU Compute on the Web — введення в GPU-обчислення в вебі.

The Essential Guide To JavaScript's Newest Data Type: BigInt — введення в BigInt в JavaScript.

Machine Learning For Front-End With Developers Tensorflow.js — введення в машинне навчання з Tenserflow.js.

Faster Loading Image With Embedded Image Previews — предзагрузка зображень без генерації картинок в маленькому дозволі.

The story of a V8 performance cliff in React — як V8 працює в залежності від JavaScript-змінних.

Using Native JavaScript Modules in Production Today — як використовувати нативні JavaScript модулі в реальному житті (демо ).

Should you be using Web Workers? (hint: probably not) — плюси і мінуси впровадження Web Worker'ів.

React

How to write great React — як писати React-код краще (збірник рад).

Використовуємо React Hooks:

3 Security Pitfalls Every React Developer Should Know — починаємо думати про безпеку.

GraphQL

GraphQL vs REST .

Multiplayer Tic Tac Toe with GraphQL — будуємо гру на GraphQL.

How we learned to stop worrying and love GraphQL — про використання GraphQL в проектах Revolut.

Angular

Why you should choose Angular for your next front-end project .

Perspectives from Contributing to Angular .

Real-Time Search Engine With RxJS: Part 1 , Part 2 .

Angular: show loading indicator when obs$ | async is not yet resolved .

Asynchronous Modules and Components in Angular Ivy .

Послухати

Frontend Weekend:

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

devschacht:

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

CSSSR:

Бібліотеки

Chart.xkcd — бібліотека для створення хkdc-графіків.

Chakra-ui — бібліотека модульних, доступних компонентів для React-додатків.

Draqula — мінімалістичний GraphQL клієнт для React-додатків.

Atomize — красива дизайн-система на styled-components і React JS.

Moveable — бібліотека event-маніпуляцій (drag&-drop, resizing тощо).

Конференції і митапы

JSConf EU 2019

NG-MY 2019

JAMstack_conf_london 2019

Інше

Beyond The Browser: Getting Started With Serverless WebAssembly .

The Making of an Animated Favicon — створюємо анімований фавикон.

How Web Content Can Affect Power Usage — як веб-сторінка може впливати на енерговитратність.

How JavaScript Росло Up and Became a Real Language — хронологія еволюції JavaScript.

Time to First Byte: What It Is and Why It Matters — що таке TTFB і від чого вона залежить.

VS Code Extensions For Web Dev Productivity — прокачуємо VSCode.

Making Instagram.com faster: Part 1 , Part 2 .

Grammarly шукає талановитих Front - end інженерів для удосконалення нашого продукту, створення мінімалістичних елегантних користувальницьких інтерфейсів і вирішення складних технічних завдань. Нашим продуктом користуються мільйони користувачів щодня. У нас чудова команда, разом з якою ми використовуємо самі передові технології. І якщо вам цікаво стати частиною її, то дивіться відкриті вакансії тут , або стукайте мені в Facebook .

З вами був Григорій Шехет. До нових зустрічей =^.^=

? Попередній випуск: Front-end дайджест #35 .

Опубліковано: 14/09/19 @ 10:00
Розділ Різне

SEO Блог