W3C опубликовал CSS Snapshot 2020

В нём собраны воедино все спецификации, которые вместе формируют текущее состояние CSS по состоянию на 2020 год.

https://www.w3.org/TR/2020/NOTE-css-2020-20201222/#css

Декабрьские релизы спецификаций от W3C

- Web Authentication: An API for accessing Public Key Credentials Level 2 (Candidate Recommendation)
- CSS Text Module Level 3 (Candidate Recommendation)
- CSS Box Model Module Level 3 (Candidate Recommendation)
- CSS Backgrounds and Borders Module Level 3 (Candidate Recommendation)
- CSS Cascading and Inheritance Level 3 (Proposed Recommendation)

А также совместная работа W3C и WHATWG — HTML Review Draft (Proposed Recommendation)

Сегодня прощаемся с Flash Player

Adobe больше не будет поддерживать Flash Player после 31 декабря 2020 года, а также будет блокировать запуск Flash-содержимого в Flash Player с 12 января 2021 года. Кстати, если вдруг кто-то не знал, то ActionScript 2.0+ был частичной имплементацией так и не выпущенной спецификации ECMAScript 4.

https://www.adobe.com/products/flashplayer/end-of-life.html

Команда React представила своё исследование серверных компонентов

Скорее всего Вы уже в курсе, но я на всякий случай расскажу об этом. Серверные компоненты — это новый тип компонентов React, которые имеют прямой доступ к данным бекенда и не отправляются в составе бандла на клиент. Они также могут быть sharable (одновременно клиентскими и серверными), позволяют автоматически разделять код на чанки. Обмен данными происходит в специальном компактном формате (представляющем JSX). Для реализации данного подхода был разработан экспериментальный плагин для Webpack. Дальнейшая разработка будет вестись совместно усилиями команд React и Next.js.

Запись в блоге React и видео: https://reactjs.org/blog/2020/12/21/data-fetching-with-react-server-components.html

Статья Addy Osmani из Google о серверных компонентах в React: https://addyosmani.com/blog/react-server-components/

Черновик RFC: https://github.com/josephsavona/rfcs/blob/server-components/text/0000-server-components.md

Выложен полный плейлист со всеми видео недавней онлайн конференции #WebAssembly Live! On Air

https://www.youtube.com/playlist?list=PL6TuxoG36L8lwmNrlIqGBXwlh1ejfk8xJ

Авторы State of CSS опубликовали The State of CSS 2020 Trend Report

В отчёте отражены три основных тренда в CSS: CSS фреймворки, CSS-in-JS фреймворки и новые фичи в самом CSS.

Полные результаты State of CSS: https://2020.stateofcss.com/en-US/

Source Map Visualization

Новый инструмент для отладки Source Map от Evan Wallace (автор esbuild). Его отличительная черта, что спроектирован быть высокопроизводительным, так что отладка огромных карт кода становится возможной. Работает действительно быстро.
Ценителям стоит заглянуть в репозиторий, потому что вся имплементация это по одному файлу на HTML, JavaScript и CSS. Проект не использует зависимостей, то есть каких либо фреймворков или сборщиков, что нетипично для современного фронтенда. При этом весь JS это ~1200 sloc или 48kb. Ключевая часть интерфейса (две скролируемые области с текстом и связи между фрагментами) реализована на canvas.

Движок ChakraCore окончательно передан коммьюнити

JavaScript движок ChakraCore, который ранее использовался в браузере Edge Legacy (Edge до миграции на Chromium), окончательно передан коммьюнити. Microsoft будет предоставлять обновления безопасности для ветки 1.11 до 9 марта 2021.

Репозиторий движка теперь находится тут: https://github.com/chakra-core/ChakraCore

Проект нуждается в контрибьюторах. Исходный код движка очень хорошо структурирован и отлично подходит для изучения работы виртуальных машин. А добавление какой-нибудь фичи идеально подойдёт в качестве дипломного проекта 😉
Присоединиться к разработке можно через issues на GitHub или чат в Discord.

Состоялся релиз Wasmer 1.0

Wasmer — это рантайм для исполнения #WebAssembly на сервере. В версии 1.0 значительно увеличена скорость компиляции, а также появилось несколько новых фич.

https://medium.com/wasmer/wasmer-1-0-3f86ca18c043

Вышел Safari Technology Preview 118

Список изменений в этот раз снова не содержит некоторые из них, но может дать примерную общую картину. На самом деле там как минимум ещё очень много изменений в JavaScriptCore, включая улучшенную совместимость ECMAScript, частичную поддержку #WebAssembly Bulk Memory Operations и Reference Types.

https://webkit.org/blog/11439/release-notes-for-safari-technology-preview-118/

Кодовая база WebKit теперь хранится на GitHub

Ранее на GitHub уже было зеркало git-репозитория WebKit, но теперь это полноценный репозиторий. Ишью и пулл реквесты пока что не получится использовать, но в течение нескольких месяцев они также станут доступны. Пока что для заведения багов всё ещё используется Bugzilla. WebKit стал первым из самых распространённых браузеров, чьи исходники полностью и официально размещены на GitHub.

https://github.com/WebKit/WebKit

Fastly включили поддержку QUIC и HTTP/3

В данный момент их поддержка работает в Chrome, Safari 14 на Big Sur, а также находится за флагом в Firefox.

https://www.fastly.com/blog/debugging-quic-with-h2o-and-qlog

Front-End Performance Checklist 2021

Smashing Magazine выпустили очень большой и подробный гайд о том, как увеличить производительность сайта. Он охватывает всевозможные метрики, сборщики, оптимизацию ассетов, CDN, HTTP/2 и HTTP/3, и много всего другого.

https://www.smashingmagazine.com/2021/01/front-end-performance-2021-free-pdf-checklist/

В Firefox Nightly появилась частичная поддержка Chrome DevTools Protocol

Благодаря частичной поддержке CDP, теперь можно использовать средства автоматизации Puppeteer и Selenium 4 для управления Firefox, а также удалённую отладку.

https://hacks.mozilla.org/2021/01/improving-cross-browser-testing-part-2-new-automation-features-in-firefox-nightly/

Вышел TypeScript 4.2 Beta

Из нового:
- Остаточные элементы теперь могут находиться в любом месте кортежей, а не только в середине
- Сохранение псевдонимов типов в случаях, когда они раньше раскладывались на базовые
- Шаблонные выражения теперь имеют шаблонные литеральные типы
- Более строгие проверки для оператора in
- новый флаг компилятора --noPropertyAccessFromIndexSignature
- модификатор abstract для сигнатур конструкторов
- флаг компилятора --explainFiles
- улучшения взаимодействия опциональных свойств и строковых сигнатур ключа объекта

Также представлены несколько ломающих изменений, которые могут затронуть некоторых пользователей.

https://devblogs.microsoft.com/typescript/announcing-typescript-4-2-beta/

В V8 появился дополнительный движок для обработки некоторых сложных случаев регулярных выражений

Новый движок пока что является экспериментальным и включается отдельным флагом. Он появился в дополнение к старому движку Irregexp (на который в прошлом году также перешёл Firefox).

Вышел отчёт State of JS 2020

Версия на анлийском: https://2020.stateofjs.com/en-US/

Версия на русском: https://2020.stateofjs.com/ru-RU/
Версия на украинском (переведена частично): https://2020.stateofjs.com/ua-UA/

Микрофронтенды на Blazor

Wael Kdouh из Microsoft делится советами о том, как построить микрофронтенд архитектуру, используя Blazor и #WebAssembly.

https://medium.com/@waelkdouh/microfrontends-with-blazor-webassembly-b25e4ba3f325

7 способов протестировать доступность с помощью DevTools Chromium

Christian Heilmann написал статью об инструментах DevTools в таких браузерах как Edge и Chrome, которые позволяют определить проблемы доступности на сайте.

https://christianheilmann.com/2021/01/11/seven-ways-to-test-for-accessibility-of-your-web-site-with-browser-developer-tools/

Создание игры с дополненной реальностью

Ada Rose Cannon из команды Samsung Internet о создании игры с использованием WebXR DOM Overlay API и WebXR Hit Test API.

https://medium.com/samsung-internet-dev/making-an-ar-game-with-aframe-529e03ae90cb