Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
•
«Новости 512» от CSSSR: Angular 13, Firefox 94, реактивность, лекции ШРИ Яндекса 2021, ReactConf 2021, развитие Svelte
•
Подкаст «Веб-стандарты» №307. Firefox 94, Chrome Dev Summit, Web.Dev, Next.js, Yarn, TypeScript, вёрстка чата, взлом пакета
•
Подкаст «Фронтенд Юность» #213 JavaScript — Зло
•
Подкаст «ProConf» #112: SmashingConf — Виталий Фридман
•
Подкаст «Goose&Duck» #9 – Попался, воришка! с Андреем Ситником
•
Что нужно знать о вёрстке под ретину
•
ХPath: что нужно делать, а что нет
•
AMP безвозвратно подорвала доверие издателей к инициативам Google
•
Использование веб-воркеров для повышения производительности сторонних скриптов
•
Звёздный рейтинг: решение с использованием SVG
•
Создание компонента Sidenav
•
Разработка настоящих компонентов: блок сообщения Facebook Messenger
•
Анимация height: auto
•
Функции сравнения в CSS: min(), max() и clamp()
•
CSS Loaders & Spinners
•
Быстрые и грязные переопределения в Bootstrap налету
•
Эффект матового стекла для иконок в CSS
•
Эффект матового стекла в CSS
•
Как исправить проблемы с фоновой прокруткой в CSS
•
Дженерики в TypeScript
•
Блокчейн на JavaScript
• Web-фреймворк Pusa, переносящий логику JavaScript-фронтэнда на сторону сервера
• Применение невидимых unicode-символов для скрытия действий в JavaScript-коде
•
Rust — будущее инфраструктуры JavaScript
•
Что такое Chrome Scripting API?
•
JavaScript Sanitizer API: современный способ безопасного манипулирования DOM
•
Создание легкой и производительной карусели с использованием ванильного JavaScript
•
Делает ли ES6 устаревшими JavaScript фреймворки ?
• В Chromium добавлена возможность локального запрета просмотра кода web-страниц
• Google прекратит поддержку старых версий Chrome в этом месяце
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.

Медиа | Веб-разработка | CSS | JavaScript | Браузеры
Медиа
•
«Новости 512» от CSSSR: Angular 13, Firefox 94, реактивность, лекции ШРИ Яндекса 2021, ReactConf 2021, развитие Svelte •
Подкаст «Веб-стандарты» №307. Firefox 94, Chrome Dev Summit, Web.Dev, Next.js, Yarn, TypeScript, вёрстка чата, взлом пакета•
Подкаст «Фронтенд Юность» #213 JavaScript — Зло•

Подкаст «ProConf» #112: SmashingConf — Виталий Фридман•

Подкаст «Goose&Duck» #9 – Попался, воришка! с Андреем СитникомВеб-разработка
•
Что нужно знать о вёрстке под ретину•
ХPath: что нужно делать, а что нет•
AMP безвозвратно подорвала доверие издателей к инициативам Google•
Использование веб-воркеров для повышения производительности сторонних скриптов-
Инструменты
•
Введение в отладку на примере Firefox DevTools, часть 3 из 4
• Новинки DevTools (Chrome 96)
-
Доступность
•
Assistiv Labs — новый онлайн-сервис для удаленного доступа к вспомогательными технологиями доступности, такими как NVDA, JAWS и Windows High Contrast Mode, с помощью любого современного веб-браузера.
•
Избыточно избыточная доступность a11y
-
Эффекты
•
Анимация при прокрутке с помощью WAAPI и ScrollTimeline
•
Подборка креативных сайтов «Inspirational Websites Roundup» #31
CSS
•
Звёздный рейтинг: решение с использованием SVG•
Создание компонента Sidenav•
Разработка настоящих компонентов: блок сообщения Facebook Messenger•
Анимация height: auto•
Функции сравнения в CSS: min(), max() и clamp()•
CSS Loaders & Spinners•
Быстрые и грязные переопределения в Bootstrap налету •
Эффект матового стекла для иконок в CSS•
Эффект матового стекла в CSS •
Как исправить проблемы с фоновой прокруткой в CSSJavaScript
•
Дженерики в TypeScript•
Блокчейн на JavaScript• Web-фреймворк Pusa, переносящий логику JavaScript-фронтэнда на сторону сервера
• Применение невидимых unicode-символов для скрытия действий в JavaScript-коде
•
Rust — будущее инфраструктуры JavaScript•
Что такое Chrome Scripting API?•
JavaScript Sanitizer API: современный способ безопасного манипулирования DOM •
Создание легкой и производительной карусели с использованием ванильного JavaScript•
Делает ли ES6 устаревшими JavaScript фреймворки ?-
Теория
•
JavaScript: заметка о requestAnimationFrame и requestIdleCallback
•
Деструктуризация массивов и объектов в JavaScript — в чем разница?
•
Написание чистого кода на JavaScript
•
5 топ функций JavaScript ES12, которые вы должны использовать сейчас
-
React
•
Как сделать игру 2048 на React
•
Next.js: подробное руководство. Итерация первая
•
Простая реализация темного режима (и многоцветных тем) В React
•
React Suspense: уроки, извлеченные при загрузке данных
•
Создание энциклопедии с помощью React и Wikipedia Search API
•
Обзор решений для управления состоянием в React и NextJS
•
Учебное пособие по React Router 6
•
Лучшие практики для ифреймов в React
-
Vue
•
Атомарный дизайн с Vue
•
Как делать Debounce и Throttle колбеки во Vue
•
Создайте приложение для поиска фильмов с помощью Petite-Vue, легкой альтернативой VueJS
-
Angular
•
Angular, инкапсулируй это
•
Как я оптимизировал плохую кодовую базу angular и сократил время загрузки страницы в 10 раз
•
Как поддерживать пользователей IE11 при переходе на Angular 13
•
Настройте модули отложенной загрузки в Angular для нескольких фронтендов
-
Ember
•
Перенос аддона Ember в новый v2 формат
•
Автоматизация релизов Ember с помощью Rust
•
Ember.js Template Imports: часть 3
•
Ember.js Template Imports: часть 4
-
Svelte
•
Создатель Svelte: веб-разработка должна приносить больше удовольствия
•
Рич Харрис, создатель Svelte, присоединяется к Vercel
•
Реализация локализации в Svelte
•
Введение в тестирование приложений со SvelteKit
-
Libs & Plugins
•
Splide — легкий, гибкий и доступный слайдер/карусель, написанный на TypeScript. Никаких зависимостей, никаких проблем с Lighthouse.
•
hashids.js — Небольшая библиотека JavaScript для генерации числовых id в стиле YouTube
•
MiniMasonry.js — Минималистичная библиотека без зависимостей для создания masonry-структуры
Браузеры
• В Chromium добавлена возможность локального запрета просмотра кода web-страниц
• Google прекратит поддержку старых версий Chrome в этом месяце
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.
Комментарии (4)

Megas
18.11.2021 16:12Новинки DevTools (Chrome 96)
Ссылка на русскую версию статьи, которая была переведена автоматичски… читать невозможно. Уж лучше давать ссылку на английский оригинал.
alexzfort Автор
20.11.2021 22:01Почему автоматически?
Над статьей указано "Переводы предоставлены Alena Batitskaya. Редактор — Maxim Salnikov."
john_samilin
Какая-то очень странная история с этим Pusa.
Среди достоинств выделяются: исключение необходимости участия JavaScript-разработчиков фронтэнда
и как бы проблемы с фронтом решены, да?
alexzfort Автор
¯\_(ツ)_/¯