Фронтенд-дайджест №349 (21 — 27 января 2019)

Приветствуем, коллеги. Хотелось бы начать с классики:

Однако, далеко не все так просто с этой картинкой. Во-первых, обратная сторона фронтенда часто бывает куда ужасней бекенда (спасибо армии начинающих верстальшиков, поколению jquery-разработчиков и желающих "войти в айти" в условный react без базы). Но и на этом не все. С каждым годом наблюдается все больший раскол фронтендеров, проходящий между разработчиками UX и фронтами, предпочитающими JS стэк. На прошлой неделе эта мысль была сформулирована и озвучена Крисом Койером в его статье The Great Divide, о великом разломе между двумя сторонами фронтенда. Статья собрала (и продолжает собирать) большое количество коментариев, где разработчики делятся своими мыслями и болью на ту же тему. На reddit также появилось много тем, связанных разломом. Например, одна из самых популярных тем, крик души 36-летнего отца четырех детей, который, не смотря на богатый опыт работы, чувствует себя чужим в разговорах об Angular и React.

Медиа

• Подкаст «Веб-стандарты», Выпуск №158: Сайт «Веб-стандартов», события и сообщества, новинки Safari TP, свежие статьи, снипеты и редакторы кода, кому нужен VR, фонд GitNation.
• Девшахта #67: Вопросы безопасности
• Подкаст «CSSSR» Новости 512 — Выпуск №35 (21.01 — 27.01)
• Подкаст «Фронтенд Юность (18+)» #80 Мешок с говном который сидит за компом
• Подкаст «5 minutes of React » #23 - Hasura GraphQL Engine
• "ALL YOUR HTML" #s2e6: Raymarching, бесконечное пространство
• FrontSpot Show: Куда пропал RSConf? Мелкософт побеждает Фейсбук? Халявные билеты на ReactAmsterdam!. Пилотный выпуск нового шоу

Веб-разработка

• SEO: Почему rel=canonical может игнорироваться на сайтах, использующих JS, а также почему старые сайты могут ранжироваться выше, чем более свежий контент

• Рассказ о том, как не надо проектировать API

• Electron: разработка настольных приложений

• В чем я не шарю в 2018. Ден Абрамов решил сам написать русский перевод своей популярной статьи

• Великое разделение. Два фронтенд-разработчика сидят в баре. И им не о чем говорить.

• Что мы узнали о тенденциях найма разработчиков в 2019 году из анализа 112 654 тестов кодирования

• Как создавать виртуальную реальность с помощью веб-технологий, новая серия видео

• Как мы перешли с Wordpress на React и подняли $80 миллионов

• Детальный обзор Feature policy. За рамками черновиков.

• Производительность:

  • Оптимизация сайта для GooglePage Speed (учтены все особенности после его обновления) Часть 1
  • Юзабилити веб-страниц имеет значение
  • Предзагрузка ссылок с использованием Service Workers

• Tools:

  • Webpack: неожиданное путешествие
  • Что нового в DevTools (Chrome 73)
  • Будущее Yarn - v2 и после
  • rrweb ('record and replay the web'): инструмент для записи и воспроизведения взаимодействия пользователей в вебе

• Анимация:

  • Создание собственного симулятора гравитации и космоса
  • SVG Filter Effects: контурный текст с
  • Les Animals - сайт с выдающимся дизайном и анимацией

CSS

• Градиентные границы в CSS
• Text-transform и копирование. Что происходит при копировании текста с text-transform
• Шаблоны дизайна таблиц в вебе
• Анимация CSS Grid
• Flexbox.ninja - веб-сайт, помогающий лучше понять CSS Flexbox Layout Module.
• Градианы и Обороты: тихие герои CSS углов
• Ваш инструментарий для создания CSS лейаутов в 2019, - доклад Rachel Andrew
• Firefox DevTools для тех, кто работает с CSS
• Урок по Гудини: CSS рисование и переменные

JavaScript

• JS-битва: как я написал свой eval()

• Осваиваем async/await на реальном примере

• Как работать с денежными значениями в JavaScript

• Почему каждое новое веб-приложение в PayPal начинается с TypeScript

• Что нового в JavaScript на 2019 год

• Погружение в JavaScript: как создать конвертер цветов Hex2RGB

• Нахождение наиболее повторяющегося символа

• TypeScript:

  • Цена TypeScript
  • TypeScript ESLint - репозиторий с инструментами, которые позволяют ESLint поддерживать TypeScript
  • Функциональный TypeScript: TypeScript стандарт для надежных serverless функций

• Node:

  • Бесплатные книги по Node.js
  • Лучшие 7 Node.js фреймворков для разработчиков
  • Инструментарий работы с HTTP запросами в node
  • Мультипоточность Node.js: что такое Worker Threads и чем они важны?

• Теория:

  • Шпаргалка по современному JavaScript
  • 10 вещей, которые стоит знать каждому JavaScript-разработчику
  • Как использовать деструктуризацию в JavaScript (ES6) в полной мере
  • Шаблоны итераторов JavaScript
  • Полное руководство по алгоритмам в JavaScript, бесплатный курс, состоящий из шести уроков
  • Что такое tree shaking и как оно работает?
  • 15 полезных примеров использования map(), reduce() и filter()

• VueJS:

  • Обзор Vue.js 2.6
  • Vuex — это просто!
  • 10 профессиональных советов Vue.js от мастеров Vue
  • Как определить, является ли Vue.js подходящим фреймворком для вашего следующего проекта

• React:

  • React: практики, которые помогут стать продвинутым разработчиком
  • Почему Х не хук?
  • Полезности в React 16.6.0
  • Подтверждение почты с помощью React
  • Как разработать свои React-суперспособности с помощью Context API
  • Использование элементов Content Editable в JavaScript (React)
  • Как понять редьюсеры: вы можете их использовать без Redux
  • Понимание React Default Props
  • Понимание Fragments в React

• Angular:

  • Лучшее из мира Angular за неделю — Дайджест №1 (18 января - 25 января)
  • Angular 8: вторая бета доступна для загрузки
  • Angular 6 + Travis CI c Headless Chrome
  • Оптимизация Angular. Мемоизация pipe функций в шаблонах
  • Делаем появления сообщений об ошибках форм в Angular волшебными

• Libs & Plugins:

  • Сравнение библиотек для построения диаграмм в JavaScript
  • autoComplete.js - Простое автозаполнение на ванильном Javascript
  • hotkey: вызов действия на элементе при нажатии клавиш на клавиатуре

Браузеры

• История одной проблемы со Speedometer, или Как Chromium управляет памятью
• От новых API в Chromium пострадает не только uBlock Origin, но и другие расширения
• Новая редакция манифеста Chrome сделает невозможным использование uBlock Origin
• В Firefox 66 будет устранено смещение прокрутки из-за загрузки изображений