Дайджест свежих материалов из мира фронтенда за последнюю неделю №451 (18 — 24 января 2021)

---

Сайт-источник PVSM.RU: https://www.pvsm.ru

Путь до страницы источника: https://www.pvsm.ru/razrabotka-veb-sajtov/360961

Ссылки в тексте:

[1] Медиа: #media

[2] Веб-разработка: #development

[3] CSS: #css

[4] JavaScript: #js

[5] Браузеры: #browser

[6] Подкаст «Веб-стандарты» №265: Smashing Conf, Puppeteer и Firefox, состояние всего, video как picture, чек-лист по перфомансу: https://soundcloud.com/web-standards/episode-265

[7] «Новости 512» от CSSSR: Chrome 88, Meteor.js 2.0, Deno 1.7, CSS clip-path(), 300+ вопросов по React, JS Rising Stars 2020: https://soundcloud.com/csssr/chrome-88-meteorjs-20-deno-17-css-clip-path-300-voprosov-po-react-js-rising-stars-2020

[8] Подкаст «Фронтенд Юность» #170: В #опу стейт менеджеры: https://soundcloud.com/frontend_u/e170

[9] Чтобы быть впереди веба, веб-стандартам нужно бежать в два раза быстрее: https://css-live.ru/articles-css/chtoby-byt-vperedi-veba-veb-standartam-nuzhno-bezhat-v-dva-raza-bystree.html

[10] Думать в парадигме Jamstack: https://remotesynthesis.com/blog/thinking-in-jamstack

[11] HTML и CSS все еще не про рисование кодом: https://christianheilmann.com/2021/01/21/teaching-html-and-css/

[12] Что нового в DevTools (Chrome 89): https://developers.google.com/web/updates/2021/01/devtools

[13] Как измеряются метрики сайта: LCP, FID и CLS: https://tproger.ru/articles/kak-izmerjajutsja-metriki-sajta-lcp-fid-i-cls/

[14] Как мы улучшили производительность SmashingMagazine: https://www.smashingmagazine.com/2021/01/smashingmag-performance-case-study/

[15] Браузерный JPEG-оптимизатор, соблюдающий конфиденциальность и использующий Web Workers и WebAssembly: https://jpeg.rocks/

[16] Как избежать сдвигов макета из-за веб-шрифтов: https://simonhearne.com/2021/layout-shifts-webfonts/

[17] Важность порядка подключения `@font-face` при использовании preload: https://nooshu.github.io/blog/2021/01/23/the-importance-of-font-face-source-order-when-used-with-preload/

[18] Использование Performance Web API с Chrome DevTools: https://blog.bitsrc.io/using-the-performance-web-api-with-chrome-devtools-f4c59564b3d4

[19] Опубликован первый черновик WCAG 3 : https://www.w3.org/WAI/standards-guidelines/wcag/wcag3-intro/

[20] Чего ожидать от первого публичного черновика WCAG 3.0: https://www.deque.com/blog/first-public-working-draft-wcag-3/

[21] Анимация букв в прокрутке : https://tympanus.net/codrops/2021/01/20/on-scroll-letter-animations/

[22] Подборка креативных веб-демок «Awesome Demos Roundup #19»: https://tympanus.net/codrops/2021/01/22/awesome-demos-roundup-19/

[23] Создание пузырей с текстом для комиксов с помощью SVG и javascript: https://humaan.com/blog/creating-comic-book-speech-bubbles-with-svg-and-javascript/

[24] Первый публичный черновик CSS-каскада 5 уровня: https://css-live.ru/vecssti-s-polej/pervyj-publichnyj-chernovik-css-kaskada-5-urovnya.html

[25] Понимание Clip Path в CSS: https://ishadeed.com/article/clip-path/

[26] Как работает CSS?: https://elad.medium.com/how-does-css-work-92fe7116916d

[27] Область видимости CSS с использованием Shadow DOM: https://blog.bitsrc.io/scoping-css-using-shadow-dom-a548985b73af

[28] CSS Clamp(): адаптивная комбинация, которую мы все ждали: https://blog.bitsrc.io/css-clamp-the-responsive-combination-weve-all-been-waiting-for-f1ce1981ea6e

[29] Новое в Chrome 88: aspect-ratio: https://css-tricks.com/new-in-chrome-88-aspect-ratio/

[30] Используйте CSS Clamp для создания более гибкой обертки: https://piccalil.li/quick-tip/use-css-clamp-to-create-a-more-flexible-wrapper-utility

[31] Как воспроизводить и приостанавливать анимацию CSS с помощью кастомных свойств CSS: https://css-tricks.com/how-to-play-and-pause-css-animations-with-css-custom-properties/

[32] Руководство по единицам размерности в CSS — ч.1: посмотрите на эти абсолютные единицы!: https://www.peerigon.com/en/blog/complete-guide-to-css-units-series-part-1-absolute-units

[33] Введение в JavaScript Temporal API: https://www.sitepoint.com/javascript-temporal-api-introduction/

[34] Поддержка приложений на JavaScript в долгосрочной перспективе: https://9elements.com/blog/maintaining-javascript-applications-in-the-long-term/

[35] Ландшафт JavaScript в 2021 году : https://medium.com/@rbultitudezone/the-javascript-landscape-in-2021-573d5e7a43c6

[36] Объяснение управления памятью в JavaScript: https://blog.asayer.io/javascript-s-memory-management-explained

[37] Server-Side Rendering с нуля до профи: https://habr.com/ru/post/527310/

[38] Почему React Context не является инструментом «управления состоянием» (и почему он не заменяет Redux): https://blog.isquaredsoftware.com/2021/01/context-redux-differences/

[39] Вам действительно нужен Redux? — Плюсы и минусы этой библиотеки управления состоянием : https://blog.asayer.io/do-you-really-need-redux-pros-and-cons-of-this-state-management-library

[40] Сравнение 5 лучших библиотек React для анимации: https://blog.logrocket.com/the-top-5-react-animation-libraries-compared/

[41] Магия многошаговых форм, основанных на React: https://css-tricks.com/the-magic-of-react-based-multi-step-forms/

[42] Styled-components vs. Emotion-JS для обработки CSS: https://blog.logrocket.com/styled-components-vs-emotion-for-handling-css/

[43] Использование хуков с React Router: https://blog.logrocket.com/using-hooks-with-react-router/

[44] Как лучше писать React компоненты: https://www.freecodecamp.org/news/how-to-write-better-react-components/

[45] Почему Vue.js — отличный выбор для веб-проектов и как он обошел React: https://dou.ua/lenta/columns/from-react-to-vuejs/

[46] Взгляд на GraphQL во Vue : https://blog.graphqleditor.com/graphql-vue/

[47] Делаем приложение интерактивным при помощи Angular и RxJs.: https://ashatilovdev.medium.com/57-%D0%B4%D0%B5%D0%BB%D0%B0%D0%B5%D0%BC-%D0%BF%D1%80%D0%B8%D0%BB%D0%BE%D0%B6%D0%B5%D0%BD%D0%B8%D0%B5-%D0%B8%D0%BD%D1%82%D0%B5%D1%80%D0%B0%D0%BA%D1%82%D0%B8%D0%B2%D0%BD%D1%8B%D0%BC-%D0%BF%D1%80%D0%B8-%D0%BF%D0%BE%D0%BC%D0%BE%D1%89%D0%B8-angular-%D0%B8-rxjs-12f0cc552524

[48] Angular и принципы SOLID : https://indepth.dev/posts/1414/angular-and-solid-principles

[49] RxJS в Angular: часть III: https://indepth.dev/posts/1364/rxjs-in-angular

[50] Чистая архитектура Angular: https://medium.com/weekly-webtips/angular-clean-arquitecture-d40e9c50f51

[51] I Love Ember.js — шаблоны: https://medium.com/codex/i-ember-js-templates-bf01190ce4c

[52] Философия Svelte: https://blog.scottlogic.com/2021/01/18/philosophy-of-svelte.html

[53] Awesome Svelte: Полезные ресурсы для разработки приложений на Svelte : https://github.com/rocketlaunchr/awesome-svelte

[54] Компонентная разработка со Svelte: https://maurogarcia.dev/maurogarcia.dev/posts/component-driven-development-with-svelte/

[55] iSSR — библиотека для обработки Side Effects при написании React SSR приложений.: https://github.com/AlexSergey/issr

[56] JerryScript: легкий JavaScript-движок для Интернета вещей : https://github.com/jerryscript-project/jerryscript

[57] tinyX — Крошечный менеджер состояний для больших приложений : https://github.com/dmaevsky/tinyx

[58] Brave — первый браузер с нативной поддержкой протокола IPFS. Это первый шаг к децентрализованной Сети: https://itc.ua/news/brave-pervyj-brauzer-s-nativnoj-podderzhkoj-protokola-ipfs-eto-pervyj-shag-k-deczentralizovannoj-seti/

[59] Релиз Chrome 88: https://www.opennet.ru/opennews/art.shtml?num=54423

[60] Разбираем V8. Заглядываем под капот Chrome на виртуалке с Hack The Box: https://xakep.ru/2021/01/20/htb-ropetwo-v8/

[61] Состоялся релиз Edge 88: «спящие вкладки», менеджер паролей, поиск на боковой панели и др.: https://3dnews.ru/1030705

[62] Обновления конфиденциальности и безопасности в Microsoft Edge 88: https://blogs.windows.com/msedgedev/2021/01/21/edge-88-privacy/

[63] В Safari 14 добавлена поддержка WebExtensions. Так где же расширения?: https://sixcolors.com/post/2021/01/safari-14-added-webextensions-support-so-where-are-the-extensions/

[64] Сравнение приватности браузеров: https://spyware.neocities.org/articles/browsers.html

[65] Дайджест за прошлую неделю: https://habr.com/ru/post/537782/

[66] dersmoll: http://habrahabr.ru/users/dersmoll/

[67] alekskorovin: http://habrahabr.ru/users/alekskorovin/

[68] Источник: https://habr.com/ru/post/538972/?utm_source=habrahabr&utm_medium=rss&utm_campaign=538972

Нажмите здесь для печати.