Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
• Подкаст «Веб-стандарты» №246. Chrome 86, фокус, ::marker, отладка шрифтов, скринридеры, модалки, флексы и селект
• Подкаст «Фронтенд Юность (18+)» #154 Храни процедуры с молоду
• Подкаст CSSSR — Оптимизация фронтенда, адаптивность в 2020, scaling NodeJS, SSH-приманки и Figma для разработчиков
• Исправление странной ошибки и стратегии отладки, проверенные временем
• TeX в SVG: опенсорс-решение в помощь веб-разработчикам образовательных проектов
• Путь к Федеративному GraphQL
• Безопасность npm-проектов, часть 2
• Вы знаете что такое GeoJSON?
• Cross-site Scripting (XSS): определение и предотвращение
• 5 малоизвестных функций Chrome DevTools
• Google развеял популярные мифы о контенте
• Изменение определенных букв с помощью CSS и JavaScript
• Практическое руководство по Web Cryptography API
• Проектирование заголовочных частей сайтов с использованием CSS Flexbox
• Кастомные, доступные radio/checkbox кнопки с идеальным выравниванием
• Parsel: небольшой парсер CSS-селекторов
• Как работает перспектива в CSS
• Как легко создавать текстовые градиенты с помощью CSS.
• TypeScript. Продвинутые типы
• Работа с непредвиденными данными в JavaScript
• Работа с медиа-запросами в JavaScript
• Обновление архитектуры DevTools: переход на модули JavaScript
• Настоящий компас в мобильных браузера с помощью Javascript
• Mozilla представила новые возможности по продвижению дополнений к Firefox
• В Chrome началось включение блокировщика ресурсоёмкой рекламы
• Вредоносный пакет npm воровал файлы Discord и браузеров
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.
Медиа | Веб-разработка | CSS | JavaScript | Браузеры
Медиа
• Подкаст «Веб-стандарты» №246. Chrome 86, фокус, ::marker, отладка шрифтов, скринридеры, модалки, флексы и селект
• Подкаст «Фронтенд Юность (18+)» #154 Храни процедуры с молоду
• Подкаст CSSSR — Оптимизация фронтенда, адаптивность в 2020, scaling NodeJS, SSH-приманки и Figma для разработчиков
Веб-разработка
• Исправление странной ошибки и стратегии отладки, проверенные временем
• TeX в SVG: опенсорс-решение в помощь веб-разработчикам образовательных проектов
• Путь к Федеративному GraphQL
• Безопасность npm-проектов, часть 2
• Вы знаете что такое GeoJSON?
• Cross-site Scripting (XSS): определение и предотвращение
• 5 малоизвестных функций Chrome DevTools
• Google развеял популярные мифы о контенте
• Изменение определенных букв с помощью CSS и JavaScript
• Практическое руководство по Web Cryptography API
- Производительность
• Как сделать предзагрузку адаптивных изображений с помощью imagesize и imagesrcset
• PRPL паттерн: Решения для оптимизации современных веб-приложений
• AVIF готов к использованию
• Метрики производительности для фронтенд приложений
• Введение в программный запуск Lighthouse
- Доступность
• Разработка в учетом Reduced Motion для людей, чувствительных к движущимся объектам
• Как и почему доступность важна для SEO
• На что обращать внимание при аудите доступности
- Эффекты
• Как получить рукописную анимацию с неровными штрихами с помощью SVG Stroke
• Кнопки с эффектом конфетти
CSS
• Проектирование заголовочных частей сайтов с использованием CSS Flexbox
• Кастомные, доступные radio/checkbox кнопки с идеальным выравниванием
• Parsel: небольшой парсер CSS-селекторов
• Как работает перспектива в CSS
• Как легко создавать текстовые градиенты с помощью CSS.
JavaScript
• TypeScript. Продвинутые типы
• Работа с непредвиденными данными в JavaScript
• Работа с медиа-запросами в JavaScript
• Обновление архитектуры DevTools: переход на модули JavaScript
• Настоящий компас в мобильных браузера с помощью Javascript
- Теория
• Метод функций bind своими руками
• Начало работы с современным JavaScript — Proxy
• Понимание Event Loop, Callbacks, Promise и Async/Await в JavaScript
• 5 лучших практик clean coding в JavaScript
- React
• React: слоты как у сына маминой подруги
• Почему я разочаровался в хуках
• Jotai, новая библиотека управления состоянием для React
• React Chrono — Компонент временной шкалы для React
• Функциональные компоненты React с хуками: все, что вам нужно знать
• Более простая альтернатива Redux
• История хуков в React
- Vue
• Введение в Vue Teleport — новую функциональность в Vue3
• Анонс (новой) Ionic Vue Beta
• Советы для новичков в VueJs
- Angular
• 3 совета по управлению стилями, которые избавят вас от головной боли с CSS в вашем приложении на Angular
• ControlValueAccessor и contenteditable в Angular
• Локализация Angular с Ivy
• Преимущества добавления rx-query в ваш проект на Angular
• Как я избавился от State Observables в Angular
• Оптимизируйте размер пакета Angular в 4 шага
- Ember
• The Ember Times — Issue No. 163
• Подготовка Embroider
• Совместное использование Parent Model в Route Boundaries
- Svelte
• Начало работы со Svelte JS: создание корзины для покупок
- Libs & Plugins
• Символьные вычисления в JavaScript с помощью Math.js
• vanilla-colorful — порт react-colourful на ванильные Custom Elements.
Браузеры
• Mozilla представила новые возможности по продвижению дополнений к Firefox
• В Chrome началось включение блокировщика ресурсоёмкой рекламы
• Вредоносный пакет npm воровал файлы Discord и браузеров
Просим прощения за возможные опечатки или неработающие/дублирующиеся ссылки. Если вы заметили проблему — напишите пожалуйста в личку, мы стараемся оперативно их исправлять.
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.