https://habr.com/ru/post/490616/

• Разработка веб-сайтов
• CSS
• JavaScript
• HTML

Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.

Медиа    |    Веб-разработка    |    CSS    |    JavaScript    |    Браузеры    |    Занимательное

Медиа

• Подкаст «CSSSR»: Новости 512 — Vue.js story, React 16.13.0, ускорение сайта Leroy Merlin, реклама по-ростелекомовски
• Подкаст «Веб-стандарты» №218: Опять гриды, градиенты всё лучше, блокирующий CSS, веб-компоненты, всё про кнопки и disabled
• Подкаст «Фронтенд Юность (18+)» #127: Мало половин. Часть первая
• Подкаст «Сделайте мне красиво», Выпуск №35 — Зарплаты, деплои по пятницам и гордыня функциональщиков
• Я <3 Фронтенд 2020 — Запись трансляции

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

• Интернационализация: как сделать веб доступным для всех
• Влияют ли теги H1 на ранжирование в Google– эксперимент Moz
• Rome, новый JavaScript инструментарий от создателя Yarn и Babel из Facebook
• Один день из жизни: как фронтенд-разработчик исправляет «простой» баг
• Хватит использовать слово ‘Drop-down’

• Производительность
  • «Render-Blocking JavaScript and CSS on WordPress». Как это исправить?
  • Ускоряем фронтенд. Когда много запросов к серверу — это хорошо
  • Стоит ли хранить Google Fonts на своём сервере?
  • Улучшение воспринимаемой производительности с помощью свойства CSS `font-display`
  • Браузерная производительность, ограниченная разными Feature Policy
  • Почему 543 KB не дают мне спать по ночам
  

• Доступность
  • CSS против коронавируса: доступное представление иерархических табличных данных
  • 5 распространенных проблем с доступностью веб-приложений и способы их устранения
  • HTML: недоступные части
  

• Эффекты
  • Создание карандашного эффекта в SVG
  • Анимация SVG-текста в Path
  • Аудио эффекты искажения изображения с WebGL
  

CSS

• Стилизация старого доброго элемента button
• Старый и новый CSS. История веб-дизайна
• В W3C появилась общественная группа по CSS4
• Адаптивный макет сетки журнала всего в 20 строках CSS
• Эффект линии, переплетенной между букв на CSS
• Умная анимация с пользовательскими свойствами
• Негативные margin в CSS
• Buttono — Гибкий Sass-миксин для создания кнопок в стиле БЭМ
• Почему CSS расстраивает?
• CSS Motion Path: Конец GSAP?

JavaScript

• JavaScript и кое-что ещё: 4 креативных подхода к измерению времени в браузерах
• Может, нам слегка успокоиться с JavaScript?
• JavaScript tree shaking, like a pro
• Интернационализация JavaScript в 2020 году
• 4 рекомендации по написанию качественных модулей в JavaScript
• Как использовать JavaScript Internationalization API
• Динамическая и асинхронная функциональность в JAMstack
• 5 лучших JavaScript-фреймворков: визуализация многолетних опросов разработчиков

• Практика
  • Работа с GeoJSON в среде Node.js: практическое знакомство
  • Пишем babel плагин, пошаговое руководство
  • Задачи по JavaScript от Microsoft
  • Создание аркадной игры на ванильном JavaScript
  • Кэширование ответов GraphQL
  • Создание PWA на Vanilla JavaScript. Часть 2. Push API
  

• Теория
  • Понимание спецификации ECMAScript, часть 1
  • Об изменчивых методах объекта Math в JavaScript
  • 2 способа преобразования значений в Boolean в JavaScript
  • Как начать думать функционально в JavaScript
  • Все, что вы хотите знать о Service Worker
  

• React
  • Используем Axios в React
  • 10 фишек из JavaScript, которые помогут писать более качественный код на React
  • React + Canvas = Love
  • React Query — Хуки для выборки, кэширования и обновления асинхронных данных в React
  • Почему вы должны с умом использовать refs на продакшене
  • React.useRef и React.createRef: разница
  • Вам нравится Redux? Тогда вам понравятся react-connect-context-hooks!
  • Ошибки, которые допускают джуниор разработчики на React
  • Настройка Tailwind CSS в проекте на React
  

• Vue
  • Создаем прогрессивный PWA интернет-магазин на Nuxt.js 2 пошаговое руководство Часть 1
  • Vue.js: The Documentary
  • Создание приложения с помощью Vue и TypeScript. Лучшие практики, мысли и рекомендации.
  • Как создать музыкальный менеджер с Nuxt.js и Express.js
  • Начало работы с тестированием Vue.js: ваше руководство по ресурсам
  • (Примерное) Воссоздание Vue 3 Reactivity API
  • Использование конечных автоматов в Vue.js с XState
  

• Angular
  • Как создать эпическое приложение на Angular менее чем за 10 минут! ️
  • Вот почему вы должны использовать Angular 9 сегодня
  • Everything GitHub: Continuous Integration, Deployment и хостинг для вашего Angular приложения
  • Дорожная карта для Angular-разработчиков на 2020
  • Реактивные приключения в Angular: знакомство с Angular Effects
  

• Svelte
  • Создание приложения TODO в Svelte
  • Тестирование асинхронных изменений состояния в Svelte
  • Управление состоянием в Svelte
  

• Ember
  • The Ember Times — Выпуск 136
  • Как работает Autotracking
  • Разделение и миграция вашего Ember проекта в монорепозиторий
  

• Libs & Plugins
  • serialize-javascript — Сериализация JavaScript для расширенного набора JSON, который включает в себя регулярные выражения и функции.
  • DarkModeJS — помогает вам автоматически определять время пользователя и переключать тему на темную сторону
  

Браузеры

• В Firefox 75 будут убраны https:// и www из выпадающего блока адресной строки
• 0-day уязвимость в Chrome, выявленная через анализ изменений в движке V8
• Mozilla начинает внедрение технологии изоляции библиотек RLBox
• Google выпустил для Firefox систему аудита web-страниц Lighthouse
• В браузер Brave интегрировано обращение к archive.org для просмотра удалённых страниц
• У Chrome есть динозаврик, а у Microsoft Edge будет сёрфинг
• Защита Firefox с помощью WebAssembly
• «Могу ли я… в новом Edge?»

Занимательное

• Как цифровая реклама будет жить без cookie-файлов
• Поисковый сервис Google Images будет выводить больше сведений об изображениях — маркировать товары, рецепты и видео
• Патентные войны и спорщик на миллион: история изобретения колючей проволоки и её самого успешного продавца в 19 веке Материал редакции
• Горе обновленным. Почему апдейты могут лишить вас не только смартфона, но и автомобиля
• Google переведет все сайты на mobile-first индексацию в течение 6-12 месяцев
• Google о предстоящих изменениях в обработке nofollow

Просим прощения за возможные опечатки или неработающие/дублирующиеся ссылки. Если вы заметили проблему — напишите пожалуйста в личку, мы стараемся оперативно их исправлять.

Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.