В мае вышла новая мажорная версия Angular. Марк Тексон рассказал о всех нововведениях релиза — "Angular v12 is now available".
— Экосистема Angular продолжает миграцию на пайплайн компиляции и рендеринга Ivy; View Engine с 12-ой версии задеприкейчен и будет удалён в одном из будущих релизов.
— Добавлены инструменты для автоматической миграции на новый формат идентификаторов сообщений i18n.
— Protractor (инструмент E2E-тестирования Angular-приложений) больше не используется при создании новых проектов. Его дальнейшая судьба пока неизвестна.
— Теперь
— Добавлена поддержка Nullish Coalescing в шаблонах. Завершена миграция на Webpack 5 и добавлена поддержка TypeScript 4.2. Команда
#angular #release
https://blog.angular.io/angular-v12-is-now-available-32ed51fbfd49
— Экосистема Angular продолжает миграцию на пайплайн компиляции и рендеринга Ivy; View Engine с 12-ой версии задеприкейчен и будет удалён в одном из будущих релизов.
— Добавлены инструменты для автоматической миграции на новый формат идентификаторов сообщений i18n.
— Protractor (инструмент E2E-тестирования Angular-приложений) больше не используется при создании новых проектов. Его дальнейшая судьба пока неизвестна.
— Теперь
@Component
поддерживает инлайн SASS-кода. Добавлена поддержка новой модульной системы SASS. Angular CDK и Angular Material больше не поддерживают node-sass.— Добавлена поддержка Nullish Coalescing в шаблонах. Завершена миграция на Webpack 5 и добавлена поддержка TypeScript 4.2. Команда
ng update
по умолчанию переключена в production-режим. Задеприкейчена поддержка IE11, она будет удалена полностью в следующей мажорной версии.#angular #release
https://blog.angular.io/angular-v12-is-now-available-32ed51fbfd49
Medium
Angular v12 is now available
It’s that time again, friends — we’re back with a new release and we can’t wait to share all the great updates and features waiting for…
Недавно вышел Lighthouse 8. Самым значимым изменением в релизе стало изменение оценки "Performance Score". Каролина Щур в статье "How Lighthouse 8 Changes Affect Your Metrics" рассказала, как именно поменялась эта оценка.
Были изменены веса метрик FCP, SI, TTI, TBT и CLS. Теперь наибольшее влияние будут оказывать TBT (Total Blocking Time, +30% от общего веса всех метрик) и CLS (Cumulative Layout Shift, +10%). Если на вашем сайте была хорошая оценка, но в новой версии Lighthouse она упала, это означает, что при открытии страницы много времени занимает инициализация и выполнение клиентского кода или из-за того, что на странице происходит сдвиг контента.
Также было изменено определение метрики CLS. Подсчёт общего сдвига контента теперь происходит на основе сгруппированных оценок сдвига за пять секунд. Это изменение позволило устранить корреляцию между оценкой сдвига контента и количеством времени, проведённым на странице, улучшив общую оценку для долгоживущих страниц.
Lighthouse 8 уже доступен в PageSpeed Insights; его поддержка в Chrome появится в версии 93.
#performance #release #lighthouse
https://calibreapp.com/blog/lighthouse-8
Были изменены веса метрик FCP, SI, TTI, TBT и CLS. Теперь наибольшее влияние будут оказывать TBT (Total Blocking Time, +30% от общего веса всех метрик) и CLS (Cumulative Layout Shift, +10%). Если на вашем сайте была хорошая оценка, но в новой версии Lighthouse она упала, это означает, что при открытии страницы много времени занимает инициализация и выполнение клиентского кода или из-за того, что на странице происходит сдвиг контента.
Также было изменено определение метрики CLS. Подсчёт общего сдвига контента теперь происходит на основе сгруппированных оценок сдвига за пять секунд. Это изменение позволило устранить корреляцию между оценкой сдвига контента и количеством времени, проведённым на странице, улучшив общую оценку для долгоживущих страниц.
Lighthouse 8 уже доступен в PageSpeed Insights; его поддержка в Chrome появится в версии 93.
#performance #release #lighthouse
https://calibreapp.com/blog/lighthouse-8
Calibre - Site Speed Tools for Teams
How Lighthouse 8 Changes Affect Your Metrics
Learn about Performance Score and metric changes that will change your speed reports.
Несколько дней назад вышла новая версия Next.js. Команда разработчиков фреймворка рассказала о новинках релиза — "Next.js 11".
— В новую версию попали наработки Google, которые включают в себя разные оптимизации и правила eslint, предотвращающие использование паттернов, приводящих к деградации производительности.
— Добавлена новая реализация загрузчика Babel, ускоряющая время пересборки приложения.
— Добавлен новый компонент
— Компонент
— Добавлена экспериментальная автоматическая миграция кодовой базы Create React App на Next.js.
— Добавлен Next.js Live (Preview Release), предоставляющий удобные средства коллобарации.
— Завершена миграция на Webpack 5.
#release #jsframeworks
https://nextjs.org/blog/next-11
— В новую версию попали наработки Google, которые включают в себя разные оптимизации и правила eslint, предотвращающие использование паттернов, приводящих к деградации производительности.
— Добавлена новая реализация загрузчика Babel, ускоряющая время пересборки приложения.
— Добавлен новый компонент
Script
, упрощающий управление приоритетами загрузки скриптов.— Компонент
Image
теперь может генерировать width
и height
автоматически для улучшения метрики CLS. Была добавлена возможность автоматического создания плейсхолдеров изображений.— Добавлена экспериментальная автоматическая миграция кодовой базы Create React App на Next.js.
— Добавлен Next.js Live (Preview Release), предоставляющий удобные средства коллобарации.
— Завершена миграция на Webpack 5.
#release #jsframeworks
https://nextjs.org/blog/next-11
nextjs.org
Next.js 11
Next.js 11 continues our mission to create the best developer experience with a new conformance system and performance improvements.
Релиз Chrome 93
Сегодня вышла новая версия Chrome. Пит Лепаж и Джеселин Ин рассказали об основных фичах релиза — "New in Chrome 93".
Была добавлена поддержка CSS Module Scripts — импорт CSS-файлов в JavaScript. Импортированный CSS можно подключается к
На второй этап origin trial перешёл Multi-Screen Window Placement API, с помощью которого можно получить информацию о всех экранах пользователя и программно управлять размещением окон.
Теперь PWA могут быть зарегистрированы в качестве обработчиков URL (эта фича стала доступна в Chrome 92). Добавлена возможность кастомизации контролов управления окном PWA.
В инструментах разработчика добавлена поддержка отладки выражений от контейнера. Появилась поддержка отображения содержимого web bundle во вкладке Network. Добавлены новые опции для копирования строк из консоли. Lighthouse обновился до версии 8.1.
Chrome переходит на четырёхнедельный цикл релизов.
#chrome #release
https://developer.chrome.com/blog/new-in-chrome-93/
https://developer.chrome.com/blog/new-in-devtools-93/
Сегодня вышла новая версия Chrome. Пит Лепаж и Джеселин Ин рассказали об основных фичах релиза — "New in Chrome 93".
Была добавлена поддержка CSS Module Scripts — импорт CSS-файлов в JavaScript. Импортированный CSS можно подключается к
document
или shadowRoot
с помощью свойства adoptedStyleSheets
.На второй этап origin trial перешёл Multi-Screen Window Placement API, с помощью которого можно получить информацию о всех экранах пользователя и программно управлять размещением окон.
Теперь PWA могут быть зарегистрированы в качестве обработчиков URL (эта фича стала доступна в Chrome 92). Добавлена возможность кастомизации контролов управления окном PWA.
В инструментах разработчика добавлена поддержка отладки выражений от контейнера. Появилась поддержка отображения содержимого web bundle во вкладке Network. Добавлены новые опции для копирования строк из консоли. Lighthouse обновился до версии 8.1.
Chrome переходит на четырёхнедельный цикл релизов.
#chrome #release
https://developer.chrome.com/blog/new-in-chrome-93/
https://developer.chrome.com/blog/new-in-devtools-93/
Chrome for Developers
New in Chrome 93 | Blog | Chrome for Developers
Chrome 93 is rolling out now! You can now load CSS style sheets with import statements, just like JavaScript modules. Installed PWAs can register as URL handlers, making it possible for users to jump straight into your PWA. The Multi-Screen Window Placement…
Релиз Firefox 92
Вчера вышла новая версия Firefox. Рут Джон рассказала про новинки релиза — "Time for a review of Firefox 92".
Была добавлена поддержка CSS-свойства
Реализована поддержка CSS-дескриптора
В JavaScript-движок была добавлена поддержка нового метода
Также в CSS была добавлена поддержка управлением размером строчных букв относительно разных метрик с помощью
#firefox #release
https://hacks.mozilla.org/2021/09/time-for-a-review-of-firefox-92/
Вчера вышла новая версия Firefox. Рут Джон рассказала про новинки релиза — "Time for a review of Firefox 92".
Была добавлена поддержка CSS-свойства
accent-color
, с помощью которого можно изменять цвет элементов форм: чекбокса, радиокнопки, прогрессбара и ползунка. Это очень важное обновление, так как раньше не было возможности изменить цвет у нативных элементов, из-за чего разработчики вынуждены были создавать свои элементы управления.Реализована поддержка CSS-дескриптора
font-adjust
у @font-face
. Он позволяет тонко настраивать размер глифов, упрощая работу с разными шрифтами на одной странице. Также его можно использовать при решении проблемы сдвига контента из-за несовпадения метрик загружаемого шрифта с дефолтным шрифтом страницы.В JavaScript-движок была добавлена поддержка нового метода
Object.hasOwn(instance,prop)
, который недавно был утверждён TC39. Поведение этого метода похоже на Object.hasOwnProperty()
, но Object.hasOwn()
без дополнительных ухищрений работает с объектами, которые были созданы с помощью Object.create(null)
.Также в CSS была добавлена поддержка управлением размером строчных букв относительно разных метрик с помощью
font-size-adjust
для двух значений. Улучшена работа с многоколоночными макетами. В font-family
добавлена поддержка system-ui
— синонима для семейства системных шрифтов.#firefox #release
https://hacks.mozilla.org/2021/09/time-for-a-review-of-firefox-92/
Mozilla Hacks – the Web developer blog
Time for a review of Firefox 92
Release time comes around so quick! This month we have a few CSS updates, along with the new Object.hasOwn() static method for JavaScript.
🔥1
Релиз Chrome 94
Вчера вышла новая версия Chrome. Пит Лепаж и Джеселин Ин рассказали о новинках релиза — "New in Chrome 94".
При создании двумерного контекста рисования canvas появилась возможность выбора цветового пространства. По умолчанию используется sRGB (оно было и раньше, сейчас это закреплено на уровне спеки), можно также выбрать цветовое пространство P3.
Стал доступен WebCodecs API. Благодаря ему приложения могут использовать кодеки для декодирования видеопотока с поддержкой аппаратного ускорения. Это очень полезно для видеоредакторов, приложений видеоконференций и стриминга.
В рамках Origin Trial можно включить WebGPU. WebGPU позволяет эффективно использовать ресурсы видеокарты для обработки графики и других вычислений.
Был добавлен метод
В инструментах разработчика появилась локализация интерфейса на 80 языков. Теперь можно посмотреть список всех активных Origin Trials на вкладке Application при выборе фрейма верхнего уровня. Появилась индикация для контейнеров, инвертирование активного фильтра на вкладке Network и т.д.
#chrome #release
https://developer.chrome.com/blog/new-in-chrome-94/
https://developer.chrome.com/blog/new-in-devtools-94/
Вчера вышла новая версия Chrome. Пит Лепаж и Джеселин Ин рассказали о новинках релиза — "New in Chrome 94".
При создании двумерного контекста рисования canvas появилась возможность выбора цветового пространства. По умолчанию используется sRGB (оно было и раньше, сейчас это закреплено на уровне спеки), можно также выбрать цветовое пространство P3.
Стал доступен WebCodecs API. Благодаря ему приложения могут использовать кодеки для декодирования видеопотока с поддержкой аппаратного ускорения. Это очень полезно для видеоредакторов, приложений видеоконференций и стриминга.
В рамках Origin Trial можно включить WebGPU. WebGPU позволяет эффективно использовать ресурсы видеокарты для обработки графики и других вычислений.
Был добавлен метод
scheduler.postTask()
для управления задачами. Под капотом этот метод использует планировщик браузера. Добавлена экспериментальная поддержка CSS-свойства scrollbar-gutter
. Добавлена поддержка VirtualKeyboard API. Поддержка WebSQL задеприкейчена и запланирована к удалению в Chrome 97.В инструментах разработчика появилась локализация интерфейса на 80 языков. Теперь можно посмотреть список всех активных Origin Trials на вкладке Application при выборе фрейма верхнего уровня. Появилась индикация для контейнеров, инвертирование активного фильтра на вкладке Network и т.д.
#chrome #release
https://developer.chrome.com/blog/new-in-chrome-94/
https://developer.chrome.com/blog/new-in-devtools-94/
Chrome for Developers
New in Chrome 94 | Blog | Chrome for Developers
Chrome 94 is rolling out now! The default color space for `` elements is now formally defined as SRGB, and you can change it to Display P3. There's a new, low level way to access built in audio and video codecs, important for streaming games, video editors…
Релиз Safari 15
На сайте Apple Developer был опубликован список самых интересных фич, которые появились в новой версии Safari — "Safari 15 Release Notes".
Улучшена интеграция с iCloud Keychain Password Manager. Теперь на странице можно включить автодополнение для проверочных кодов, генерируемых в приложении. Работает интеграция с QR-кодами аутентификации. В экспериментальном режиме добавлен "passkeys" (реализация WebAuthn для Safari).
В CSS добавлена реализация
В HTML появилась поддержка
В JavaScript-движке добавлены top level await,
Стабилизирована поддержка WebGL 2. Добавлено аппаратное ускорение для кодека VP9 на всех iPad с iPadOS 15. Появилась поддержка Safari Web Extensions на iOS и iPadOS. В WebAssembly добавлена поддержка ссылочных типов, стриминговой компиляции и балковых операций с памятью.
#safari #release
https://developer.apple.com/documentation/safari-release-notes/safari-15-release-notes
На сайте Apple Developer был опубликован список самых интересных фич, которые появились в новой версии Safari — "Safari 15 Release Notes".
Улучшена интеграция с iCloud Keychain Password Manager. Теперь на странице можно включить автодополнение для проверочных кодов, генерируемых в приложении. Работает интеграция с QR-кодами аутентификации. В экспериментальном режиме добавлен "passkeys" (реализация WebAuthn для Safari).
В CSS добавлена реализация
aspect-ratio
. Для цветов можно использовать новый синтаксис lab()
, lch()
и hwb()
. Добавлена возможность использования цветовых пространств в color()
.В HTML появилась поддержка
theme-color
для тега meta
, с помощью которого можно управлять цветом вкладок и нейтральной области страницы.В JavaScript-движке добавлены top level await,
Error.cause
, BigInt64Array
, BigUint64Array
. Добавлена поддержка приватных методов и акcессоров классов. Воркеры и сервис воркеры теперь поддерживают ESM.Стабилизирована поддержка WebGL 2. Добавлено аппаратное ускорение для кодека VP9 на всех iPad с iPadOS 15. Появилась поддержка Safari Web Extensions на iOS и iPadOS. В WebAssembly добавлена поддержка ссылочных типов, стриминговой компиляции и балковых операций с памятью.
#safari #release
https://developer.apple.com/documentation/safari-release-notes/safari-15-release-notes
Релиз Firefox 93
На прошлой неделе вышла новая версия Firefox. Рут Джон рассказала про новинки релиза — "Lots to see in Firefox 93!".
Была добавлена поддержка формата AV1 Image File Format. AVIF — это открытый формат изображений, выигрывающий у WebP по степени сжатия и показывающий наилучшие результаты для небольших изображений.
Улучшена поддержка кастомных элементов. Добавлено событие
Добавлен новый тип инпута
В DevTools исправлено много утечек памяти, возникающих во время долгих сессий отладки.
#release #firefox
https://hacks.mozilla.org/2021/10/lots-to-see-in-firefox-93/
На прошлой неделе вышла новая версия Firefox. Рут Джон рассказала про новинки релиза — "Lots to see in Firefox 93!".
Была добавлена поддержка формата AV1 Image File Format. AVIF — это открытый формат изображений, выигрывающий у WebP по степени сжатия и показывающий наилучшие результаты для небольших изображений.
Улучшена поддержка кастомных элементов. Добавлено событие
slotchange
, возникающее при изменении содержимого слота. Добавлен метод HTMLElement.attachInternals()
для доступа к внутренним свойствам и методам инпутов. Добавлено свойство ElementInternals.shadowRoot
для доступа к Shadow Root внутри кастомного элемента.Добавлен новый тип инпута
<input type="datetime-local">
для выбора даты и времени. Появилась поддержка синтеза глифов шрифта для маленьких заглавных букв ( small-caps
) с помощью CSS-свойства font-sythesis
. Метод createImageBitmap
теперь поддерживает опции imageOrientation
и premultiplyAlpha
.В DevTools исправлено много утечек памяти, возникающих во время долгих сессий отладки.
#release #firefox
https://hacks.mozilla.org/2021/10/lots-to-see-in-firefox-93/
Mozilla Hacks – the Web developer blog
Lots to see in Firefox 93!
Firefox 93 comes with lots of lovely updates including AVIF image format support, filling of XFA-based forms in its PDF viewer and protection.
🔥1
Релиз Parcel 2
Parcel — это сборщик, который можно использовать без каких-либо настроек. Все опции используют разумные значения по умолчанию. Точка входа для сборки — основной HTML-файл приложения или сайта. В новой версии была улучшена производительность сборки, реализована новая система плагинов, три-шейкинг, код-сплиттинг, улучшение сборок библиотек, улучшена работа HMR и многое другое.
Значительно улучшена производительность сборки благодаря новому компилятору, написанному на Rust. В его основе лежит swc. Использование компилируемого языка уменьшило время инициализации кода и решило проблему медленной сериализации больших AST-объектов. Сборка теперь работает в десять раз быстрее и в три раза быстрее при использовании Terser.
Реализована новая система плагинов, которая делает Parcel полностью расширяемым. Она позволяет использовать Parcel как для небольших проектов, так и для серьёзных проектов со сложными требованиями к сборке.
Три-шейкинг включён по умолчанию. Он работает для ESM, CommonJS, динамических импортов и CSS-модулей. Есть диагностика проблем три-шейкинга, которую можно включить с помощью флага
В production-режиме в Parcel включена lossless-оптимизация JPEG- и PNG-изображений. Она уменьшает объём изображений, не снижая их качество. Также появилась полноценная поддержка SVG с автоматической оптимизацией с помощью SVGO.
Реализован ленивый режим разработки, в котором собираются только те файлы, которые в данный момент запрашиваются браузером, тем самым улучшая время запуска dev-сервера.
#bundle #tool #release
https://parceljs.org/blog/v2/
Parcel — это сборщик, который можно использовать без каких-либо настроек. Все опции используют разумные значения по умолчанию. Точка входа для сборки — основной HTML-файл приложения или сайта. В новой версии была улучшена производительность сборки, реализована новая система плагинов, три-шейкинг, код-сплиттинг, улучшение сборок библиотек, улучшена работа HMR и многое другое.
Значительно улучшена производительность сборки благодаря новому компилятору, написанному на Rust. В его основе лежит swc. Использование компилируемого языка уменьшило время инициализации кода и решило проблему медленной сериализации больших AST-объектов. Сборка теперь работает в десять раз быстрее и в три раза быстрее при использовании Terser.
Реализована новая система плагинов, которая делает Parcel полностью расширяемым. Она позволяет использовать Parcel как для небольших проектов, так и для серьёзных проектов со сложными требованиями к сборке.
Три-шейкинг включён по умолчанию. Он работает для ESM, CommonJS, динамических импортов и CSS-модулей. Есть диагностика проблем три-шейкинга, которую можно включить с помощью флага
--log-level verbose
. Работает автоматический код-сплиттинг с выносом общих модулей в разделяемые бандлы. Также в Parcel по умолчанию включена поддержка паттерна module/nomodule для улучшения производительности загрузки кода.В production-режиме в Parcel включена lossless-оптимизация JPEG- и PNG-изображений. Она уменьшает объём изображений, не снижая их качество. Также появилась полноценная поддержка SVG с автоматической оптимизацией с помощью SVGO.
Реализован ленивый режим разработки, в котором собираются только те файлы, которые в данный момент запрашиваются браузером, тем самым улучшая время запуска dev-сервера.
#bundle #tool #release
https://parceljs.org/blog/v2/
parceljs.org
Announcing Parcel v2!
The Parcel team is beyond excited to announce that v2.0.0 stable is now available! 🎉
👍1
Релиз Node.js 17 и план релиза Node.js 16 LTS
Сегодня вышла новая мажорная версия Node.js, которая становится веткой current — "Node.js 17 is here!".
В новой версии продолжается работа над промисификацией основных API — была добавлена поддержка промисов в модуль
На следующей неделе запланирован перевод Node.js 16 в статус LTS с поддержкой до 30 апреля 2024 года. Node.js 16 LTS будет первой версией, которая будет поставляться с бинарниками для процессоров семейства Apple M1.
Поддержка Node.js 12 LTS заканчивается в апреле 2022 года. Разработчики рекомендуют обновиться на новую версию.
#nodejs #release
https://medium.com/the-node-js-collection/node-js-17-is-here-8dba1e14e382
Сегодня вышла новая мажорная версия Node.js, которая становится веткой current — "Node.js 17 is here!".
В новой версии продолжается работа над промисификацией основных API — была добавлена поддержка промисов в модуль
readline
. OpenSSL обновлён до третьей версии. Стек-трейсы по умолчанию будут включать версию Node.js. V8 обновлён до версии 9.5. В нём появилась поддержка новых типов для Intl.DisplayNames
и новых опций форматирования часового пояса в Intl.DateTimeFormat
.На следующей неделе запланирован перевод Node.js 16 в статус LTS с поддержкой до 30 апреля 2024 года. Node.js 16 LTS будет первой версией, которая будет поставляться с бинарниками для процессоров семейства Apple M1.
Поддержка Node.js 12 LTS заканчивается в апреле 2022 года. Разработчики рекомендуют обновиться на новую версию.
#nodejs #release
https://medium.com/the-node-js-collection/node-js-17-is-here-8dba1e14e382
Medium
Node.js 17 is here!
This blog was written by Bethany Griggs, with additional contributions from the Node.js Technical Steering Committee and project…
Релиз Next.js 12
Три дня назад была представлена новая мажорная версия Next.js — "Next.js 12".
Next.js 12 по умолчанию использует swc для транспиляции JavaScript- и TypeScript-файлов. Swc — это очень быстрый аналог Babel, написанный на Rust. Благодаря ему время production-сборки стало в пять раз меньше. В три раза уменьшилось время обновления страницы при локальной разработке.
Была добавлена поддержка миддлвар для гибкой модификации HTTP-ответа. В зависимости от входящего запроса можно изменить ответ, добавить новые HTTP-заголовки, сделать редирект и т.п. Миддлвары могут работать на edge-серверах Vercel, улучшая отзывчивость приложения.
Была проведена работа для подготовки к переходу на React 18. В экспериментальном режиме доступны серверные компоненты и новый поточный серверный рендерер с поддержкой Suspense.
Теперь по умолчанию в Next.js используется ESM с поддержкой импорта CommonJS-модулей. Добавлена экспериментальная поддержка импорта модулей по URL.
В компоненте
В рамках нового релиза была опубликована библиотека
В Next.js 12 поисковым ботам будут отдаваться полностью отрендеренные страницы, использующие Incremental Static Regeneration. Обычные пользователи будут видеть интерфейс загрузки страницы.
В ломающих изменениях отказ от Webpack 4, деприкейт опции
#release #jsframeworks #react
https://nextjs.org/blog/next-12
Три дня назад была представлена новая мажорная версия Next.js — "Next.js 12".
Next.js 12 по умолчанию использует swc для транспиляции JavaScript- и TypeScript-файлов. Swc — это очень быстрый аналог Babel, написанный на Rust. Благодаря ему время production-сборки стало в пять раз меньше. В три раза уменьшилось время обновления страницы при локальной разработке.
Была добавлена поддержка миддлвар для гибкой модификации HTTP-ответа. В зависимости от входящего запроса можно изменить ответ, добавить новые HTTP-заголовки, сделать редирект и т.п. Миддлвары могут работать на edge-серверах Vercel, улучшая отзывчивость приложения.
Была проведена работа для подготовки к переходу на React 18. В экспериментальном режиме доступны серверные компоненты и новый поточный серверный рендерер с поддержкой Suspense.
Теперь по умолчанию в Next.js используется ESM с поддержкой импорта CommonJS-модулей. Добавлена экспериментальная поддержка импорта модулей по URL.
В компоненте
<Image>
появилась поддержка формата изображений AVIF. Также компонент автоматически определяет основное изображение страницы, которому нужно передать пропс priority
для улучшения метрики LCP.В рамках нового релиза была опубликована библиотека
@vercel/nft
(Node File Tracer). Она используются для генерации облегчённых standalone-сборок Next.js-приложений для serverless-окружений и контейнеризации.В Next.js 12 поисковым ботам будут отдаваться полностью отрендеренные страницы, использующие Incremental Static Regeneration. Обычные пользователи будут видеть интерфейс загрузки страницы.
В ломающих изменениях отказ от Webpack 4, деприкейт опции
target
, использование <span>
вместо <div>
в next/image
, увеличение минимальной поддерживаемой версии Node.js с 12.0.0 до 12.22.0#release #jsframeworks #react
https://nextjs.org/blog/next-12
nextjs.org
Next.js 12
Next.js 12 introduces a brand-new Rust compiler, Middleware (beta), React 18 Support, Native ESM Support, URL Imports, React Server Components (alpha), and more!
Релиз Angular 13
Сегодня вышла новая мажорная версия Angular. Марк Томпсон рассказал о всех нововведениях релиза — "Angular v13 is now Available".
— С этой версии больше недоступен View Engine — движок рендеринга, предшествующий Ivy. Благодаря его удалению открываются возможности сокращения времени компиляции, которые будут реализованы в будущем
— Изменён формат внешних модулей Angular Package Format (APF): добавлена поддержка ES2020, удалена необходимость использования
— Включена поддержка сохранения кеша сборки для ускорения скорости бандлинга. Прирост составляет 68%. Также в Angular CLI v12.2 была добавлена поддержка esbuild, который ускорил время сборки production-бандлов на 10%
— Упрощено API для динамического создания компонентов
— По умолчанию включена инвалидация окружения при прогоне каждого теста
— Улучшена доступность компонентов Angular Material
— RxJS обновлён до версии 7.4, TypeScript обновлён до версии 4.4
— Прекращена поддержка IE11. Пользователи Internet Explorer могут продолжать использовать Angular 12. Он будет поддерживаться до ноября 2022 года
#angular #release #jsframeworks
https://blog.angular.io/angular-v13-is-now-available-cce66f7bc296
Сегодня вышла новая мажорная версия Angular. Марк Томпсон рассказал о всех нововведениях релиза — "Angular v13 is now Available".
— С этой версии больше недоступен View Engine — движок рендеринга, предшествующий Ivy. Благодаря его удалению открываются возможности сокращения времени компиляции, которые будут реализованы в будущем
— Изменён формат внешних модулей Angular Package Format (APF): добавлена поддержка ES2020, удалена необходимость использования
ngcc
— Включена поддержка сохранения кеша сборки для ускорения скорости бандлинга. Прирост составляет 68%. Также в Angular CLI v12.2 была добавлена поддержка esbuild, который ускорил время сборки production-бандлов на 10%
— Упрощено API для динамического создания компонентов
— По умолчанию включена инвалидация окружения при прогоне каждого теста
— Улучшена доступность компонентов Angular Material
— RxJS обновлён до версии 7.4, TypeScript обновлён до версии 4.4
— Прекращена поддержка IE11. Пользователи Internet Explorer могут продолжать использовать Angular 12. Он будет поддерживаться до ноября 2022 года
#angular #release #jsframeworks
https://blog.angular.io/angular-v13-is-now-available-cce66f7bc296
Medium
Angular v13 is now Available
We’re back with the brand new release of Angular v13 to share with all of you! This latest release brings all sorts of updates and features…
Релиз Firefox 94
На прошлой неделе вышла новая версия Firefox. Официального блог-поста на Mozilla Hacks в этот раз не было, скорее всего из-за того, что изменений для разработчиков в релизе очень мало.
Самая интересная фича релиза — добавление поддержки структурного клонирования объектов с помощью метода
Появилась поддержка кастомизации лейбла кнопки Enter виртуальной клавиатуры с помощью свойства
У динамически создаваемых скриптов стал доступен статический метод
Уменьшено потребление памяти JavaScript-движком. Ускорен перебор свойств объектов. Уменьшено потребление CPU во время поллинга HTTPS-соединений.
#firefox #release
https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/94
https://www.mozilla.org/en-US/firefox/94.0/releasenotes/
На прошлой неделе вышла новая версия Firefox. Официального блог-поста на Mozilla Hacks в этот раз не было, скорее всего из-за того, что изменений для разработчиков в релизе очень мало.
Самая интересная фича релиза — добавление поддержки структурного клонирования объектов с помощью метода
structuredClone()
. Этот метод предназначен для глубокого клонирования объектов в том числе с циклическими ссылками. Есть поддержка перемещения для transferable objects. Это полезно для обмена данными между веб-воркерами и главным потоком.Появилась поддержка кастомизации лейбла кнопки Enter виртуальной клавиатуры с помощью свойства
enterKeyHint
элементов ввода и глобального атрибута enterkeyhint
. Можно указать: enter
, done
, go
, next
, previous
, search
, send
.У динамически создаваемых скриптов стал доступен статический метод
supports()
для проверки поддержки ECMAScript modules. Добавлена поддержка свойства ShadowRoot.delegatesFocus
для проверки текущего статуса делегирования фокуса у кастомных элементов.Уменьшено потребление памяти JavaScript-движком. Ускорен перебор свойств объектов. Уменьшено потребление CPU во время поллинга HTTPS-соединений.
#firefox #release
https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/94
https://www.mozilla.org/en-US/firefox/94.0/releasenotes/
MDN Web Docs
Firefox 94 for developers - Mozilla | MDN
This article provides information about the changes in Firefox 94 that will affect developers. Firefox 94 was released on November 2nd, 2021
🔥1
Релиз Chrome 96
Вчера вышла новая версия Chrome. Пит Лепаж и Джеселин Ин по традиции рассказали обо всех новинках релиза — "New in Chrome 96".
В рамках Origin Trail появилась поддержка хинтов приоритета (priority hints). Хинты приоритета устанавливаются с помощью атрибута
Включена поддержка флага
Реализована поддержка оптимизации Back/Forward Cache (BFCache). Теперь при каждой навигации браузер не удаляет из памяти ресурсы, использующиеся страницей, а отправляет их в BFCache на несколько минут. Если пользователь захочет вернуться назад на предыдущую страницу, то она будет восстановлена из этого кеша. Данная оптимизация использовалась только в Firefox и Safаri. Теперь она есть во всех браузерах.
Сделано несколько улучшений для PWA. В Chrome 96 была добавлена поддержка указания явного идентификатора приложения в манифесте с помощью поля
Есть много изменений в инструментах разработчика. Отображение содержимого запроса переехало из вкладки "Headers" в новую вкладку "Payload". В тестовом режиме добавлен CSS Overview. Появилась возможность копирования CSS-деклараций в формате, пригодном для вставки в JS, — полезное новшество для всех, кто использует CSS-in-JS. Теперь ошибки CORS в консоли можно спрятать. Добавлена поддержка эмуляции
#chrome #release
https://developer.chrome.com/blog/new-in-chrome-96/
https://developer.chrome.com/blog/new-in-devtools-96/
Вчера вышла новая версия Chrome. Пит Лепаж и Джеселин Ин по традиции рассказали обо всех новинках релиза — "New in Chrome 96".
В рамках Origin Trail появилась поддержка хинтов приоритета (priority hints). Хинты приоритета устанавливаются с помощью атрибута
importance
. Они используются в качестве сигналов на уровне разметки документа для управления последовательностью загрузки ресурсов.Включена поддержка флага
#force-major-version-to-100
для поднятия версии Chrome до 100. Этот флаг был добавлен для поиска потенциальных проблем парсинга строки User-Agent.Реализована поддержка оптимизации Back/Forward Cache (BFCache). Теперь при каждой навигации браузер не удаляет из памяти ресурсы, использующиеся страницей, а отправляет их в BFCache на несколько минут. Если пользователь захочет вернуться назад на предыдущую страницу, то она будет восстановлена из этого кеша. Данная оптимизация использовалась только в Firefox и Safаri. Теперь она есть во всех браузерах.
Сделано несколько улучшений для PWA. В Chrome 96 была добавлена поддержка указания явного идентификатора приложения в манифесте с помощью поля
id
. Также теперь PWA-приложения могут регистрироваться в качестве обработчиков протоколов. Например, если PWA почтового клиента зарегистрируется как обработчик протокола mailto
, тогда это приложение будет открываться автоматически при кликах по ссылкам с префиксом mailto:
.Есть много изменений в инструментах разработчика. Отображение содержимого запроса переехало из вкладки "Headers" в новую вкладку "Payload". В тестовом режиме добавлен CSS Overview. Появилась возможность копирования CSS-деклараций в формате, пригодном для вставки в JS, — полезное новшество для всех, кто использует CSS-in-JS. Теперь ошибки CORS в консоли можно спрятать. Добавлена поддержка эмуляции
prefers-contrast
и тёмной автотемы.#chrome #release
https://developer.chrome.com/blog/new-in-chrome-96/
https://developer.chrome.com/blog/new-in-devtools-96/
Релиз TypeScript 4.5
Сегодня вышел TypeScript 4.5. Дениэл Розенвассер рассказал о всех новинках релиза.
Был добавлен новый утилитарный тип
С версии 4.5 встроенные типы можно обновлять отдельно от компилятора. Также теперь можно оверрайдить встроенные типы, используя пакеты
Строковые шаблонные типы могут использоваться в качестве дискрименантов в union'ах. Эта фича будет полезна при типизации ответов API.
В условных типах появилась оптимизация хвостовой рекурсии, благодаря которой можно описывать типы, полагающиеся на большое число итераций. Например, с его помощью можно затипизировать полноценный утилитарный тип
Появилась возможность отключения удаления неиспользуемых импортов. Также в рамках этой фичи был добавлена поддержка модификатора
Реализованы пропозалы "Ergonomic Brand Checks" и "Import assertions".
Также в этой версии должна была появиться поддержка ESM для Node.js, но она была временно удалена из-за несовместимости с экосистемой и проблем в реализации.
#release #typescript
https://devblogs.microsoft.com/typescript/announcing-typescript-4-5/
Сегодня вышел TypeScript 4.5. Дениэл Розенвассер рассказал о всех новинках релиза.
Был добавлен новый утилитарный тип
Awaited
. Этот тип моделирует разворачивание промисов с помощью await
в async-функциях и метода .then()
у промисов. Awaited
теперь используется для типизации Promise.all
, улучшая вывод типов. С версии 4.5 встроенные типы можно обновлять отдельно от компилятора. Также теперь можно оверрайдить встроенные типы, используя пакеты
@typescript/lib-*
в node_modules
.Строковые шаблонные типы могут использоваться в качестве дискрименантов в union'ах. Эта фича будет полезна при типизации ответов API.
В условных типах появилась оптимизация хвостовой рекурсии, благодаря которой можно описывать типы, полагающиеся на большое число итераций. Например, с его помощью можно затипизировать полноценный утилитарный тип
TrimLeft
.Появилась возможность отключения удаления неиспользуемых импортов. Также в рамках этой фичи был добавлена поддержка модификатора
type
для импортируемых типов: import {someFunction, type BaseType} from "./module.js";
.Реализованы пропозалы "Ergonomic Brand Checks" и "Import assertions".
Также в этой версии должна была появиться поддержка ESM для Node.js, но она была временно удалена из-за несовместимости с экосистемой и проблем в реализации.
#release #typescript
https://devblogs.microsoft.com/typescript/announcing-typescript-4-5/
Microsoft News
Announcing TypeScript 4.5
Today we’re excited to announce the release of TypeScript 4.5! If you’re not yet familiar with TypeScript, it’s a language that builds on JavaScript by adding statically checked types. When you use static types, you can run the TypeScript compiler to check…
Релиз Firefox 95
В Firefox 95 включён RLBox — технология для улучшения безопасности браузера с помощью WebAssembly. Также в этой версии для всех пользователей был включён Site Isolation.
В macOS уменьшено потребление процессора во время обработки событий. А также было уменьшено потребление энергии при программном декодировании видео. Это особенно заметно в режиме полноэкранного просмотра.
В HTML был добавлен глобальный атрибут
В JS-движке значительных изменений не было, но был добавлен
#firefox #release
https://www.mozilla.org/en-US/firefox/95.0/releasenotes/
https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/95
В Firefox 95 включён RLBox — технология для улучшения безопасности браузера с помощью WebAssembly. Также в этой версии для всех пользователей был включён Site Isolation.
В macOS уменьшено потребление процессора во время обработки событий. А также было уменьшено потребление энергии при программном декодировании видео. Это особенно заметно в режиме полноэкранного просмотра.
В HTML был добавлен глобальный атрибут
inputmode
для настройки вида виртуальной клавиатуры на смартфонах. Firefox на Android теперь поддерживает CSS-свойство cursor
.В JS-движке значительных изменений не было, но был добавлен
Crypto.randomUUID()
— API для получения криптографически устойчивых значений UUID. Изменено поведение свойства SpeechSynthesisEvent.elapsedTime
; теперь оно возвращает время в секундах.#firefox #release
https://www.mozilla.org/en-US/firefox/95.0/releasenotes/
https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/95
🔥1
Релиз Safari 15.2
На прошлой неделе вышла новая версия Safari. Джен Симмонс рассказала про основные новинки релиза — "New WebKit Features in Safari 15.2".
— Объём доступной памяти для WebAssembly увеличен до 4Гб. Была оптимизирована обработка исключений.
— Добавлена поддержка HTTP-заголовков Cross-Origin-Opener-Policy и Cross-Origin-Embedder-Policy для включения
— Добавлена поддержка цветового пространства P3 в canvas
— Добавлена поддержка File Access API для упрощённой работы с файлами в веб-приложениях
По набору новых фич видно, что разработчики WebKit активно работают над добавлением поддержки веб-версии Photoshop.
Safari 15.2 доступен в macOS Monterey, Big Sur, Catalina и в iOS/iPadOS 15.2.
#safari #release
https://webkit.org/blog/12140/new-webkit-features-in-safari-15-2/
https://developer.apple.com/documentation/safari-release-notes/safari-15_2-release-notes
На прошлой неделе вышла новая версия Safari. Джен Симмонс рассказала про основные новинки релиза — "New WebKit Features in Safari 15.2".
— Объём доступной памяти для WebAssembly увеличен до 4Гб. Была оптимизирована обработка исключений.
— Добавлена поддержка HTTP-заголовков Cross-Origin-Opener-Policy и Cross-Origin-Embedder-Policy для включения
SharedArrayBuffer
— Добавлена поддержка цветового пространства P3 в canvas
— Добавлена поддержка File Access API для упрощённой работы с файлами в веб-приложениях
По набору новых фич видно, что разработчики WebKit активно работают над добавлением поддержки веб-версии Photoshop.
Safari 15.2 доступен в macOS Monterey, Big Sur, Catalina и в iOS/iPadOS 15.2.
#safari #release
https://webkit.org/blog/12140/new-webkit-features-in-safari-15-2/
https://developer.apple.com/documentation/safari-release-notes/safari-15_2-release-notes
🎉1
Релиз Chrome 97
На прошлой неделе вышла новая версия Chrome. Пит Лепаж и Джеселин Ин рассказали про новинки релиза — "New in Chrome 97".
В Chrome 97 по умолчанию включён WebTransport API. С его помощью обеспечивается быстрый обмен данными между клиентом и сервером в сетях с высокими задержками. Поддерживается передача данных без гарантии доставки пакетов с помощью Datagram API и с гарантиями доставки пакетов с помощью Streams API. WebTransport API работает только с HTTP/3.
Добавлена поддержка экспериментального метода
В JavaScript-движке у массивов появились методы
В Chrome DevTools добавлена вкладка "Recorder". С её помощью можно записывать и повторно воспроизводить действия на странице (user flows). Обновлён список эмулируемых устройств. На вкладке "Elements" появилось автодополнение при редактировании HTML. Настройки DevTools теперь можно синхронизировать между разными устройствами.
#chrome #release
https://developer.chrome.com/en/blog/new-in-chrome-97/
https://developer.chrome.com/blog/new-in-devtools-97/
На прошлой неделе вышла новая версия Chrome. Пит Лепаж и Джеселин Ин рассказали про новинки релиза — "New in Chrome 97".
В Chrome 97 по умолчанию включён WebTransport API. С его помощью обеспечивается быстрый обмен данными между клиентом и сервером в сетях с высокими задержками. Поддерживается передача данных без гарантии доставки пакетов с помощью Datagram API и с гарантиями доставки пакетов с помощью Streams API. WebTransport API работает только с HTTP/3.
Добавлена поддержка экспериментального метода
HTMLScriptElement.supports()
. Благодаря ему можно определить, какой вид скриптов поддерживается браузером.В JavaScript-движке у массивов появились методы
findLast()
, findLastIndex()
для поиска элементов с конца.В Chrome DevTools добавлена вкладка "Recorder". С её помощью можно записывать и повторно воспроизводить действия на странице (user flows). Обновлён список эмулируемых устройств. На вкладке "Elements" появилось автодополнение при редактировании HTML. Настройки DevTools теперь можно синхронизировать между разными устройствами.
#chrome #release
https://developer.chrome.com/en/blog/new-in-chrome-97/
https://developer.chrome.com/blog/new-in-devtools-97/
Chrome for Developers
New in Chrome 97 | Blog | Chrome for Developers
Chrome 97 is rolling out now! There's a new option for sending real time messages between the client and server using Web Transport. You can use feature detection to see what types of scripts a browser supports. JavaScript gets better, and there's plenty…
🔥17👍9
Релиз Firefox 96
Несколько дней назад вышла новая версия Firefox. Самое интересное — изменение поведения кук, добавление Web Locks API, добавление поддержки CSS-свойства color-scheme.
Теперь по умолчанию у всех кук устанавливается атрибут
Добавлен Web Locks API. Это экспериментальное API для управления доступом к разделяемым ресурсам между разными сервис-воркерами или табами приложения.
Добавлена поддержка CSS-свойства
В этом примере свойство
В энкодере изображений появилась поддержка WebP. Благодаря этому изменению теперь можно программно экспортировать WebP-изображения из canvas с помощью методов
#firefox #release
https://www.mozilla.org/en-US/firefox/96.0/releasenotes/
https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/96
Несколько дней назад вышла новая версия Firefox. Самое интересное — изменение поведения кук, добавление Web Locks API, добавление поддержки CSS-свойства color-scheme.
Теперь по умолчанию у всех кук устанавливается атрибут
SameSite=lax
. Это изменение выравнивает поведение Firefox c Chrome и помогает в защите от атак Cross-Site Request Forgery (CSRF).Добавлен Web Locks API. Это экспериментальное API для управления доступом к разделяемым ресурсам между разными сервис-воркерами или табами приложения.
Добавлена поддержка CSS-свойства
color-scheme
. С его помощью реализация тёмной темы для страницы делается в пару строк:
:root {
color-scheme: light dark;
}
В этом примере свойство
color-scheme
сообщает браузеру о том, что вся страница поддерживает светлую и тёмную тему, и браузер начинает управлять цветами страницы автоматически.В энкодере изображений появилась поддержка WebP. Благодаря этому изменению теперь можно программно экспортировать WebP-изображения из canvas с помощью методов
HTMLCanvasElement.toDataURL()
, HTMLCanvasElement.toBlob()
и OffscreenCanvas.toBlob()
.#firefox #release
https://www.mozilla.org/en-US/firefox/96.0/releasenotes/
https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/96
Mozilla
Firefox 96.0, See All New Features, Updates and Fixes
🔥11👍5
Релиз Chrome 98
Позавчера вышла новая версия Chrome. Пит Лепаж и Джеселин Ин рассказали обо всех новинках релиза — "New in Chrome 98".
В рамках Origin Trial автоматической тёмной темы на Android теперь можно отказаться от применения темы на отдельных страницах с помощью
Появилась поддержка COLRv1 — нового формата шрифтов c поддержкой цветных глифов, градиентов и смешивания. COLRv1 обеспечивает максимальное сжатие большого количества небольших изображений.
При обращении к приватным сетям теперь отправляются CORS Preflight-запросы. Запущен новый Origin Trial кроппинга захватываемого видео с помощью Region Capture API.
В инструментах разработчика теперь используется редактор на базе Codemirror 6. Благодаря ему была улучшена поддержка очень больших файлов, исправлена проблема со смещением прокрутки во время отладки. Появилась новая панель для отладки дерева доступности. Lighthouse был обновлён до девятой версии. Добавлен новый инструмент для упрощения отладки проблем с Back/Forward Cache.
#chrome #release
https://developer.chrome.com/blog/new-in-chrome-98/
https://developer.chrome.com/blog/new-in-devtools-98/
Позавчера вышла новая версия Chrome. Пит Лепаж и Джеселин Ин рассказали обо всех новинках релиза — "New in Chrome 98".
В рамках Origin Trial автоматической тёмной темы на Android теперь можно отказаться от применения темы на отдельных страницах с помощью
<meta name="color-scheme" content="only light">
и CSS-свойства color-scheme: only light;
.Появилась поддержка COLRv1 — нового формата шрифтов c поддержкой цветных глифов, градиентов и смешивания. COLRv1 обеспечивает максимальное сжатие большого количества небольших изображений.
При обращении к приватным сетям теперь отправляются CORS Preflight-запросы. Запущен новый Origin Trial кроппинга захватываемого видео с помощью Region Capture API.
В инструментах разработчика теперь используется редактор на базе Codemirror 6. Благодаря ему была улучшена поддержка очень больших файлов, исправлена проблема со смещением прокрутки во время отладки. Появилась новая панель для отладки дерева доступности. Lighthouse был обновлён до девятой версии. Добавлен новый инструмент для упрощения отладки проблем с Back/Forward Cache.
#chrome #release
https://developer.chrome.com/blog/new-in-chrome-98/
https://developer.chrome.com/blog/new-in-devtools-98/
👍12🔥1