Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
•
Веб-технологии, которые могут работать не так, как ожидается
•
Микрофронтенд, как не скатиться в ад
•
Перестроились в модульный монолит, а не в микросервисы
• Новинки DevTools (Chrome 93)
•
Табы или пробелы? ➡️ Почему мы повернули не туда и как табы помогают
•
Интерактивные инструменты обучения для фронтенд-разработчиков
•
Объяснение структуры HTML и CSS в клиенте Twitter
•
Глубокое погружение в чудесный мир displacement фильтрации в SVG
•
Распространенные ошибки NPM, которых следует избегать каждому разработчику
•
Полное руководство по GraphQL для новичков
•
Assembler CSS — статический CSS фреймворк с миссией улучшить производительность вашего сайта, генерируя только минимальное количество CSS, необходимое каждой веб-странице.
•
Использование SVG с медиа-запросами
•
Создание компонента для пошаговой навигации
•
Рефакторинг CSS: оптимизация размеров и производительность (часть 3)
•
Интерактивное руководство по Keyframe Animations
•
Топ-5 генераторов CSS Grid Layout
•
Pure CSS: как создать арт-галерею в виде трехмерного вращающегося куба, используя только CSS
•
ColorPicker для веб-сайтов или всего экрана помощью JavaScript EyeDropper API.
•
7 методов создания хороших переменных в JavaScript
•
Подробный разбор вопроса для интервью: вложенные массивы
•
Особенности ES2022: блоки статической инициализации классов
•
Предложения, включенные в грядущий стандарт ECMAScript 2022 для JavaScript
•
Advanced Typescript
• Из настроек Chrome планируют убрать раздел для детализированного управления Cookie
• Проект Pale Moon добился прекращения разработки браузера Mypal
• Релиз Chrome 93
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.
Веб-разработка
•
![habr](https://habrastorage.org/storage2/c57/b92/af4/c57b92af4ee0d37f787c211a068b1b95.png)
•
![habr](https://habrastorage.org/storage2/c57/b92/af4/c57b92af4ee0d37f787c211a068b1b95.png)
•
![habr](https://habrastorage.org/storage2/c57/b92/af4/c57b92af4ee0d37f787c211a068b1b95.png)
• Новинки DevTools (Chrome 93)
•
![video](https://habrastorage.org/storage3/976/d3e/38a/976d3e38a34b003f86f91795524af9f8.gif)
•
![en](https://habrastorage.org/storage3/2e2/522/737/2e2522737ec404a9f76047e108dfaea0.gif)
•
![en](https://habrastorage.org/storage3/2e2/522/737/2e2522737ec404a9f76047e108dfaea0.gif)
•
![en](https://habrastorage.org/storage3/2e2/522/737/2e2522737ec404a9f76047e108dfaea0.gif)
•
![en](https://habrastorage.org/storage3/2e2/522/737/2e2522737ec404a9f76047e108dfaea0.gif)
•
![en](https://habrastorage.org/storage3/2e2/522/737/2e2522737ec404a9f76047e108dfaea0.gif)
CSS
•
![en](https://habrastorage.org/storage3/2e2/522/737/2e2522737ec404a9f76047e108dfaea0.gif)
•
![en](https://habrastorage.org/storage3/2e2/522/737/2e2522737ec404a9f76047e108dfaea0.gif)
•
![en](https://habrastorage.org/storage3/2e2/522/737/2e2522737ec404a9f76047e108dfaea0.gif)
•
![en](https://habrastorage.org/storage3/2e2/522/737/2e2522737ec404a9f76047e108dfaea0.gif)
•
![en](https://habrastorage.org/storage3/2e2/522/737/2e2522737ec404a9f76047e108dfaea0.gif)
•
![en](https://habrastorage.org/storage3/2e2/522/737/2e2522737ec404a9f76047e108dfaea0.gif)
•
![en](https://habrastorage.org/storage3/2e2/522/737/2e2522737ec404a9f76047e108dfaea0.gif)
JavaScript
•
![en](https://habrastorage.org/storage3/2e2/522/737/2e2522737ec404a9f76047e108dfaea0.gif)
•
![en](https://habrastorage.org/storage3/2e2/522/737/2e2522737ec404a9f76047e108dfaea0.gif)
•
![en](https://habrastorage.org/storage3/2e2/522/737/2e2522737ec404a9f76047e108dfaea0.gif)
•
![en](https://habrastorage.org/storage3/2e2/522/737/2e2522737ec404a9f76047e108dfaea0.gif)
•
![en](https://habrastorage.org/storage3/2e2/522/737/2e2522737ec404a9f76047e108dfaea0.gif)
•
![en](https://habrastorage.org/storage3/2e2/522/737/2e2522737ec404a9f76047e108dfaea0.gif)
-
React
•Виртуализация больших списков данных с помощью react-window
•Руководство по React Context и хуку useContext()
•5 методов оптимизации производительности React
-
Vue
• Vue.js — Как я вызываю метод в компоненте извне компонента в Vue 2
•Vue.js: как мигрировать большой проект с Vue 2 на Vue 3
•Vue: когда computed property может быть неправильным инструментом
•VueUse как необходимая библиотека для Vue 3
-
Angular
•Почему НЕ следует использовать функции в Angular HTML
•Вам не нужно использовать Observables в Angular
•Создание вектороскопа в Angular 12
•NGRX — используйте Actions для создания более реактивных приложений
-
Svelte
•Sveltey: Cli для Svelte-Kit
Браузеры
• Из настроек Chrome планируют убрать раздел для детализированного управления Cookie
• Проект Pale Moon добился прекращения разработки браузера Mypal
• Релиз Chrome 93
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.