Всем привет, это «Новости 512» от CSSSR. В этом выпуске мы поговорим о релизе Chrome 116, добавлении поддержки ES-модулей в Redux, подумаем, устарел ли React, узнаем, стоит ли переходить на Turbopack вместо Webpack, от самого автора инструментов, посмотрим на несколько кейсов, потом порассуждаем о разных типах архитекторов ПО и отдадим дань уважения автору редактора Vim.
Я хочу сказать большое спасибо всем, кто уже поучаствовал в опросе. Я подожду до следующего выпуска и потом расскажу о некоторых результатах опроса. Если вы вдруг хотели заполнить опрос и ещё не успели, то, пожалуйста, сделайте это. Вы очень поможете. Спасибо.
Интересные публикации
Вы думаете, что самое крупное приключение прошедших двух недель — это Baldurs Gate 3? А попробуйте перевести на ES-модули крупный и очень популярный open-source проект, которым пользуются миллионы. Именно об этом первый материал. Марк Эриксон, мейнтейнер Redux, рассказал как раз о таком приключении. В итоге получилось совсем не «10 минут — туда и обратно». Пришлось учесть огромное количество нюансов: как лучше всего описать конфигурацию и типы, как пакеты будут вести себя с разными инструментами и в разных средах, как поддерживать другие популярные инструменты и т. д. В статье Марк подробно описывает шаги обновления и уроки, которые извлёк. Тема сложная и обширная, а в голове нужно держать много моментов. В качестве бонуса вы найдёте в статье множество полезных ссылок, которые помогут глубоко разобраться в вопросе.
Ещё один кейс от продукта с большим количеством пользователей. Речь идёт о Dropbox и уменьшении размера его JS-бандла на 33%. Если коротко, то проект переехал на Rollup. Он помог автоматизировать и усовершенствовать tree shaking, code splitting и уменьшить инженерную сложность. Переход прошёл не без проблем, потому что сначала Rollup пришлось интегрировать с существующей архитектурой, а его использование привело к повышенному расходу вычислительных ресурсов. Помимо этого, инженеры Dropbox описали стратегию раскатки новых изменений на всех пользователей.
React уже давно с нами и стал стандартом для разработки приложений. Но так ли он актуален прямо сейчас? Джош Колинсуорт (Josh Colinsworth) считает, что уже давно пора смотреть на другие фреймворки. Он порассуждал о том, почему React может быть не так хорош. Джош отметил, что React уже далеко не самый быстрый на рынке, не так прост в освоении и оброс громоздкой экосистемой. В пользу других фреймворков он приводит такие аргументы, как зрелость, примерно одинаковые фичи, скорость их развития, простота стилизации компонентов и другие. В конце статьи он как раз рекомендует альтернативы и высказывает свои соображения на тему того, в каком случае на какой фреймворк лучше посмотреть. Сам он остановился на Svelte, но в целом рекомендует Vue как ближайшую к React альтернативу.
Я уже несколько раз упоминал в выпусках новый бандлер Turbopack, который создан автором Webpack Тобиасом Копперcом (Tobias Koppers). Умирает ли Webpack и пора ли всем бегом переходить на Turbopack, рассказал сам Тобиас в гостях у Джека Херрингтона (Jack Herrington) на YouTube. Переходить на Turbopack пока рановато, но стоит начать к нему присматриваться. Тобиас рассказал о том, что переписывать сам Webpack было бы долго и больно, поэтому было принято решение создать новый бандлер и учесть опыт Webpack. Turbopack работает в режиме ленивой компиляции, написан на Rust и предлагает упрощённую конфигурацию. Поговорили немного и о планах: например, в бандлере планируют реализовать что-то наподобие Module Federation, а через какое-то время он станет дефолтом для Next.js-проектов. Было интересно, больше подробностей по ссылке в описании — видео идёт всего 10 минут.
Нужны ли серверным компонентам свои собственные DevTools? Алвар Лагерлёф (Alvar Lagerlöf) считает, что да. И на самом деле, каких-то инструментов особенно нет, хотя и сами серверные компоненты пока не на проде. Алвар поэкспериментировал с парсингом информации приходящей информации о серверных компонентах о серверных компонентах. Он разобрал данные, создал прототип дизайна и создал браузерное расширение, которое представляет данные в удобном виде. Пока расширение на ранних стадиях, но им уже можно пользоваться, скачав исходники с GitHub. Помимо этого, автор поделился парой ссылок на статьи о серверных компонентах.
Александр Инкин в блоге Тинькофф на Хабре опубликовал статью о том, какие виды деревьев существуют в Angular и почему важно разбираться в их отличиях. На примере простейшего приложения, на котором уже видно различия, он демонстрирует View, Dependency Injection и DOM-деревья внутри Angular-приложения. Александр рассказал о случаях, в которых знание нюансов необходимо, и о том, как с этим работать. Мне было сложновато, потому что я не знаю Angular достаточно хорошо. Если вы постоянно с ним работаете, то вам должно быть понятнее. Это достаточно продвинутая тема, но автор постарался раскрыть её в более практической и сжатой форме.
Дальше немного кейсов. В блоге 2gis была опубликована статья о рендеринге на карте большого количества объектов, а конкретно — зданий. Владимир Лобода рассказал о том, как это устроено и работает под капотом. Ребята используют Elasticsearch для выборки данных и фильтрации. Данных много, и пользователю нужно подождать. Из этой ситуации элегантно вышли, показывая кластеры объектов и постепенно детализируя карту. В статье есть разделы про форматы данных и производительность текущего решения.
Следующий кейс про оптимизацию высоконагруженного интернет-магазина на Next.js. В принципе, велосипед не изобретали, а просто последовательно проанализировали и оптимизировали. Из проекта выпилили неиспользуемый код и дублирующиеся пакеты, оптимизировали ресурсы, приструнили сторонние скрипты и блокирующие ресурсы. Польза таких статей в том, что можно посмотреть на такой кейс и взять кусочек для себя. Например, открыть новый инструмент или подход, о котором вы не знали.
Статья о разных интересных способах применения теней попалась на SmashingMagazine. Тени можно использовать для создания интересных hover-эффектов, отбрасывать тень от тени, сделать тень для текста — в общем, на что фантазии хватит. В статье есть примеры применений этих креативных приёмов. Прежде чем их использовать, я бы проверил их производительность.
Я помню время, когда без Lodash и Ramda работать было очень больно. Но время изменилось, стандарты EcmaScript развиваются, и JS сам по себе умеет сильно больше. Этому посвящён репозиторий «Вам не нужен Lodash или Underscore». В нём собраны нативные реализации методов этих библиотек. Теоретически вы, возможно, сможете отказаться библиотек или, может быть, просто захотите посмотреть на нативные реализации.
Все люди разные, а архитекторы программного обеспечения и подавно. Об этом следующая статья. Это перевод статьи Гергли Ороса (Gergely Orosz), в которой он рассказывает об архетипах разных архитекторов. Я не буду их перечислять, потому что главная польза статьи, на мой взгляд, в возможности посмотреть на то, что вам хочется в себе развить и чего вам, возможно, не хватает. Архетипы, конечно, могут быть в сочетаниях и так далее. Не воспринимайте это как строгие рамки.
Следующая статья — размышление о том, почему JS захватил мир. Дмитрий Рычков поделился своими наблюдениями, окинул взглядом прошлое и рост популярности JavaScript, а также поделился своими мыслями по этому поводу. Получилось интересно, с хорошим балансом истории и субъективного мнения.
Закроет рубрику статья об open-source нейронном радио. Владислав Радченко рассказал о том, как запилил бесконечную генерацию lofi музыки и подкастов. Есть бэк на Go, используются Audiocraft и Wunjo AI для генерации музыки и подкастов. Больше подробностей в статье, там же вы найдёте видео с подробностями.
Новости релизов
Вышел Chrome 116. Релиз был не очень большой, но достаточно интересный. В этой версии появился Document Picture-in-Picture API, позволяющий открывать окно поверх остального контента, которое можно заполнить HTML-содержимым. DevTools получили ряд улучшений для диагностики неподгруженных стилей. В коде и консоли теперь явно видно, какие стили не подгрузились, а в панелях Issues и Network информация на тему отсутствующих стилей стала более информативной. Больше подробностей в официальных обзорах Chrome и DevTools от Google.
Firefox отметился обновлением 116.0.3 с устранением ошибки в реализации протокола HTTP/3 и другими исправлениями. Добавлю, что Mozilla развивает возможность импорта дополнений из других браузеров. Пока это доступно маленькому проценту пользователей.Также была анонсирована полноценная экосистема дополнений для Android-версии браузера.
Вышел Angular 16.2. В этой версии пофиксили отображение памяти GC, добавили новые хуки жизненного цикла afterRender и afterNextRender, а также возможность дебажить инжекторы. Больше подробностей в release notes.
Фреймворк Fresh от команды Deno получил обновление 1.4. В этой версии можно кастомизировать тэги <body>
, <html>
и <head>
. Загрузка страниц была ускорена за счет предкомпиляции, появилась возможность добавлять лейауты для роутов и группировать код по роутам.
Playwright порадовал нас релизом версии 1.37. В этой версии появился инструмент для создания сводных отчётов по тестам, были представлены улучшения UI mode, а также обновлены версии браузерных движков.
Также отмечу релизы Ubuntu 22.04.3 LTS c обновлением графического стека и ядра Linux, фреймворка Electron 26.0.0 и git 2.42.
Другие новости
Вы могли слышать о том, что Гвидо ван Россум, создатель языка Python, какое-то время назад присоединился к Microsoft. Его приход в компанию ознаменовал значительный буст в поддержке Python разными продуктами Microsoft, а теперь Python добрался до Excel. Язык был интегрирован в табличный процессор, позволяет писать скрипты и макросы, строить графики и кучу всего. С учётом того, что у MS Office уже давно есть облачная версия, я бы сказал, что ребята плавно приближаются к тому, чтобы начать толкаться плечами с офисными сервисами Google в плане мощности и удобства использования. Звучит очень и очень интересно.
Следующая новость, к сожалению, печальная. Ушёл из жизни автор и ключевой разработчик редактора Vim Брам Моленар (Bram Moolenaar). Он принимал решения о развитии проекта и написал в 50 раз больше кода, чем все остальные контрибьюторы вместе взятые. Проект на этом своё существование не прекратит. Пять наиболее активных разработчиков взяли на себя управление проектом и дальнейшую разработку. Если вы пользуетесь Vim и этот редактор сделал вашу жизнь лучше, подумайте сегодня несколько секунд о Браме и мысленно скажите «спасибо».