Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
•
«Новости 512» от CSSSR: NodeJS 15.1.0, TS 4.1 RC, Promises с нуля, нативность Sketch, тарифы Travis-CI, MDN Web DNA 2020
•
Подкаст «Сделайте мне красиво», выпуск №49: Постарайтесь не выгорать джунами
•
Подкаст «Фронтенд Юность» №162: Сотни новых фронтендеров отнимают наш хлеб, №163 Стул-реквест
•
Подкаст «Веб-стандарты» №256: Chrome DevTools, HTTP-пуш, Apple ARM, разметка, CSS-книга, пиксель-пёрфект, миниапы ВКонтакте
•
Готовим console.log() правильно
•
Сравнение скорости генераторов статических сайтов
•
Есть ли перспективы у монолитных web-приложений?
• Что такое атрибут rel=noopener
• Атаки кликджекинга (clickjacking ) и как их предотвратить
•
Создание микро-фронтендов
•
История перехода Wix на React Native
•
Веб-разработка для начинающих: 12-недельная учебная программа из 24 уроков по основам JavaScript, CSS и HTML от Microsoft
•
Релиз Bootstrap 5 Alpha 3
•
Таблицы и CSS-свойство float в современной веб-разработке
•
Нативный Masonry Layout в CSS Grid Level 3
•
Простые круговые диаграммы с фоллбеком
•
Быстрый совет: как сделать новую функцию CSS Overview в Chromium Devtools доступной
•
Техника ворона: на шаг ближе к Container Queries
•
Самый правильный трюк для автоматического увеличения textarea
•
Что такое flex-grow, flex-shrink и flex-basis
•
Глубокое погружение в CSS Grid minmax()
•
Парсинг Markdown для автоматической вставки оглавления на страницу
•
Как я писал JavaScript, чтобы избежать JavaScript
•
10 выводов из масштабного внедрения TypeScript
•
Веб-воркеры для улучшения производительности UI
• Google закрыла в Chrome ещё две уязвимости нулевого дня. За месяц их было устранено уже пять
• В Chrome намерены удалить поддержку технологии Server Push
•
Warp: улучшенная производительность JS в Firefox 83
•
Прекращение поддержки IE11 — это прогрессивное улучшение
•
Создатель Python Гвидо ван Россум выходит на работу в Microsoft
• Свежий релиз WordPress 5.6 будет нести в себе еще одно крупное изменение jQuery
• Google обязал применять инклюзивную терминологию в своих открытых проектах
• Microsoft призывает пользователей отказаться от многофакторной аутентификации через телефон
• Google просит помощи пользователей, чтобы улучшить алгоритмы Google Photos
• Google Photos перестанет быть безлимитным с 1 июня 2021 года, а файлы неактивных аккаунтов (минимум два года) будут удаляться
• Британскую компанию обязали сменить странное название, потому что оно провоцировало атаки на веб-сайты
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.
Медиа | Веб-разработка | CSS | JavaScript | Браузеры | Занимательное |
Медиа
•

•

•

•

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

•

•

• Что такое атрибут rel=noopener
• Атаки кликджекинга (clickjacking ) и как их предотвратить
•

•

•

•

- Инструменты
•Chrome DevTools: создавайте собственные сочетания клавиш и повышайте производительность
•Что нового в DevTools (Chrome 88)
- SVG
•SVGBox — онлайн-инструмент для вставки SVG иконки на сайт с возможностю менять их цвет в параметре ссылки
•SVG Path Editor
•Библиотеки для анимации отрисовки SVG
- Производительность
•Как метрики Core Web Vitals влияют на алгоритмы Google
•Изображения WebP и WordPress: зачем и как их использовать (+ плагины)
- Доступность
•Puppetaria: accessibility-first скрипты для Puppeteer
•Не очень короткое замечание об использовании aria-label — Big Table Edition
•Написание кода без помощи рук
- Эффекты
•20 небольших, но вдохновляющих вызовов веб-разработчику
•Inline Menu Layout with Gallery Panel
•Эффект наведения с WebGL-текстурой с использованием curtainsjs
CSS
•

•

•

•

•

•

•

•

JavaScript
•

•

•

•

- Теория
• Все, что вам нужно знать о Proxy в JavaScript
•Начало работы с современным JavaScript — шаблонные литералы
•Декораторы JavaScript с нуля
- React
•Ленивая загрузка изображений с помощью Intersection Observer API и React
•Погружение в использование React и Three.js
•Учебное пособие по React Forms: доступ к входным значениям, проверка и отправка форм
•Используйте CSS переменные вместо React Context
•React Frontload — библиотека для загрузки и управления данными в React компонентах, работающая и на клиенте и на сервере
•Аутентификация приложений React с помощью Auth0
•Create React App: реально быстрая подготовка проектов
- Vue
•Графики в Vuejs
•Использование Vue в качестве генератора статических сайтов на Node.js
•Vue.js в Web Worker
- Angular
•Добро пожаловать в Angular 11
•Декларативный подход в Angular
•Использование Hot Module Replacement в Angular 11
•Angular 11 — На пути к безопасной типизации
•Темизация приложений на Angular и его библиотек
•Визуальное регрессионное тестирование с использованием Cypress и Angular
- Ember
•Серия интервью «The Rock & Roll with Ember band»: Serguei Cambour, Stuart Guthrie
•Использование @action и @tracked Decorators в Ember Classic Classes
- Svelte
•Svelte — «новый» фронтенд фреймворк
•Почему Svelte еще не готов к прайм-тайму (и почему он будет классным в свое время)
Браузеры
• Google закрыла в Chrome ещё две уязвимости нулевого дня. За месяц их было устранено уже пять
• В Chrome намерены удалить поддержку технологии Server Push
•

•

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

• Свежий релиз WordPress 5.6 будет нести в себе еще одно крупное изменение jQuery
• Google обязал применять инклюзивную терминологию в своих открытых проектах
• Microsoft призывает пользователей отказаться от многофакторной аутентификации через телефон
• Google просит помощи пользователей, чтобы улучшить алгоритмы Google Photos
• Google Photos перестанет быть безлимитным с 1 июня 2021 года, а файлы неактивных аккаунтов (минимум два года) будут удаляться
• Британскую компанию обязали сменить странное название, потому что оно провоцировало атаки на веб-сайты
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.
aio350
Спасибо