Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
•
«Новости 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 | Браузеры
Медиа
•

•

•

•


•


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

•

•

•

-
Инструменты
•Введение в отладку на примере Firefox DevTools, часть 3 из 4
• Новинки DevTools (Chrome 96)
-
Доступность
•Assistiv Labs — новый онлайн-сервис для удаленного доступа к вспомогательными технологиями доступности, такими как NVDA, JAWS и Windows High Contrast Mode, с помощью любого современного веб-браузера.
•Избыточно избыточная доступность a11y
-
Эффекты
•Анимация при прокрутке с помощью WAAPI и ScrollTimeline
•Подборка креативных сайтов «Inspirational Websites Roundup» #31
CSS
•

•

•

•

•

•

•

•

•

•

JavaScript
•

•

• Web-фреймворк Pusa, переносящий логику JavaScript-фронтэнда на сторону сервера
• Применение невидимых unicode-символов для скрытия действий в 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 Автор
¯\_(ツ)_/¯