✨ Как мы внедрили Knip в Angular-проект
По мере роста проекта в кодовой базе неизбежно накапливается мертвый код, неиспользуемые зависимости, файлы, экспорты и старые компоненты. В небольшом проекте это можно убрать вручную, но в крупном такой подход быстро перестает работать.
В статье разбирается практический опыт внедрения Knip в крупный nx workspace проект с большим количеством библиотек.
В результате удалось удалить сотни неактуальных файлов, сократить количество зависимостей и, главное, автоматизировать контроль за мертвым кодом, чтобы он не накапливался дальше.
👉 https://habr.com/ru/companies/tbank/articles/1078438/
По мере роста проекта в кодовой базе неизбежно накапливается мертвый код, неиспользуемые зависимости, файлы, экспорты и старые компоненты. В небольшом проекте это можно убрать вручную, но в крупном такой подход быстро перестает работать.
В статье разбирается практический опыт внедрения Knip в крупный nx workspace проект с большим количеством библиотек.
В результате удалось удалить сотни неактуальных файлов, сократить количество зависимостей и, главное, автоматизировать контроль за мертвым кодом, чтобы он не накапливался дальше.
👉 https://habr.com/ru/companies/tbank/articles/1078438/
👍11🤡4🔥3❤1
✨ withComponentInputBinding: уменьшаем связанность, инвертируем зависимости
Routed-компоненты в Angular часто сами достают параметры из URL, вызывают сервисы, загружают данные и еще решают, что показывать во время загрузки. Работает, но сам компонент при этом начинает слишком много знать о том, где и как он используется.
В статье разбирается, как с помощью withComponentInputBinding и резолверов сделать эту связь слабее. Идея довольно простая, компоненту не нужно знать о роутере и сервисе, он просто получает необходимые данные через input. А откуда эти данные взять, решается на уровне конфигурации маршрута.
withComponentInputBinding как раз позволяет напрямую передавать данные из состояния Router в input компонента, который указан в конфигурации Route.
👉 https://habr.com/ru/articles/1078996/
Routed-компоненты в Angular часто сами достают параметры из URL, вызывают сервисы, загружают данные и еще решают, что показывать во время загрузки. Работает, но сам компонент при этом начинает слишком много знать о том, где и как он используется.
В статье разбирается, как с помощью withComponentInputBinding и резолверов сделать эту связь слабее. Идея довольно простая, компоненту не нужно знать о роутере и сервисе, он просто получает необходимые данные через input. А откуда эти данные взять, решается на уровне конфигурации маршрута.
withComponentInputBinding как раз позволяет напрямую передавать данные из состояния Router в input компонента, который указан в конфигурации Route.
👉 https://habr.com/ru/articles/1078996/
👍12🔥2
✨ Скроллбар в 2k26
Кастомные скроллбары долгое время означали много JavaScript. Приходилось отслеживать scroll, считать размеры и положение ползунка, постоянно обновлять DOM и мириться с лишней нагрузкой.
В статье разбирается современный подход, где большую часть этой работы берет на себя CSS. С помощью scroll-driven animations, anchor positioning, container queries и animation-range можно синхронизировать положение и размер скроллбара непосредственно с прокруткой.
JavaScript при этом остается только для перетаскивания ползунка указателем. В итоге получается более простой и производительный компонент, который сохраняет единый внешний вид на разных платформах.
👉 https://habr.com/ru/articles/1079750/
Кастомные скроллбары долгое время означали много JavaScript. Приходилось отслеживать scroll, считать размеры и положение ползунка, постоянно обновлять DOM и мириться с лишней нагрузкой.
В статье разбирается современный подход, где большую часть этой работы берет на себя CSS. С помощью scroll-driven animations, anchor positioning, container queries и animation-range можно синхронизировать положение и размер скроллбара непосредственно с прокруткой.
JavaScript при этом остается только для перетаскивания ползунка указателем. В итоге получается более простой и производительный компонент, который сохраняет единый внешний вид на разных платформах.
👉 https://habr.com/ru/articles/1079750/
❤3🔥2👌2👍1😁1
✨ Router Resources
В Angular появляется экспериментальная альтернатива классическим Resolvers. Новый подход лучше вписывается в современную архитектуру и, что особенно важно, позволяет загружать данные параллельно.
Кроме производительности, Router Resources дают больше гибкости. Можно выбрать блокирующую или неблокирующую загрузку, перезагружать отдельный ресурс без повторной навигации, выполнять редирект при ошибках и многое другое.
Пока API экспериментальный, но направление выглядит интересным.
👉 https://www.angulararchitects.io/en/blog/router-resources-loading-data-with-the-angular-router/
В Angular появляется экспериментальная альтернатива классическим Resolvers. Новый подход лучше вписывается в современную архитектуру и, что особенно важно, позволяет загружать данные параллельно.
Кроме производительности, Router Resources дают больше гибкости. Можно выбрать блокирующую или неблокирующую загрузку, перезагружать отдельный ресурс без повторной навигации, выполнять редирект при ошибках и многое другое.
Пока API экспериментальный, но направление выглядит интересным.
👉 https://www.angulararchitects.io/en/blog/router-resources-loading-data-with-the-angular-router/
👍19❤9🔥2🤔2😁1
✨ Как крупные технологические компании создают микрофронтенды
Обычно, когда речь заходит о микрофронтендах, iframe воспринимается как устаревшее решение. На его фоне Module Federation и Native Federation выглядят привлекательнее.
Они выигрывают по производительности за счет переиспользования зависимостей, но не гарантируют изоляцию в рантайме. iframe создает тяжелый оверхед (повторная загрузка бандлов и фреймворков), но дает абсолютную изоляцию стилей, контекста исполнения браузера.
И чем больше продукт и чем старше его кодовая база, тем важнее становится эта изоляция. В кодовых базах с многолетней историей и сотнями команд невозможно полагаться на соглашения и дисциплину.
В статье рассматривается парадокс современной архитектуры. В то время как индустрия активно переходит на Module Federation и Native Federation, гиганты масштаба Google, Microsoft и Spotify в своих крупнейших продуктах продолжают использовать старые добрые iframe.
👉 https://stefanhaas.dev/article/how-big-tech-builds-micro-frontends/
Обычно, когда речь заходит о микрофронтендах, iframe воспринимается как устаревшее решение. На его фоне Module Federation и Native Federation выглядят привлекательнее.
Они выигрывают по производительности за счет переиспользования зависимостей, но не гарантируют изоляцию в рантайме. iframe создает тяжелый оверхед (повторная загрузка бандлов и фреймворков), но дает абсолютную изоляцию стилей, контекста исполнения браузера.
И чем больше продукт и чем старше его кодовая база, тем важнее становится эта изоляция. В кодовых базах с многолетней историей и сотнями команд невозможно полагаться на соглашения и дисциплину.
В статье рассматривается парадокс современной архитектуры. В то время как индустрия активно переходит на Module Federation и Native Federation, гиганты масштаба Google, Microsoft и Spotify в своих крупнейших продуктах продолжают использовать старые добрые iframe.
👉 https://stefanhaas.dev/article/how-big-tech-builds-micro-frontends/
👍5🤣5❤3👏1🤔1
✨ Рендеринг Angular-приложения в Minecraft
Кажется, Minecraft уже давно перестал быть просто игрой. В нем строят машины Тьюринга, процессоры, а недавно даже перенесли цифровую модель мозга плодовой мушки.
На этом фоне идея отрендерить Angular-приложение прямо в Minecraft выглядит достаточно интересной.
В статье разбирается, как превратить игровой мир в экран для настоящего веб-приложения. Вместо стандартного DOM-рендерера автор реализовал кастомный Renderer2, а связь с игрой поддерживается через протокол RCON.
👉 https://habr.com/ru/articles/1081682/
Кажется, Minecraft уже давно перестал быть просто игрой. В нем строят машины Тьюринга, процессоры, а недавно даже перенесли цифровую модель мозга плодовой мушки.
На этом фоне идея отрендерить Angular-приложение прямо в Minecraft выглядит достаточно интересной.
В статье разбирается, как превратить игровой мир в экран для настоящего веб-приложения. Вместо стандартного DOM-рендерера автор реализовал кастомный Renderer2, а связь с игрой поддерживается через протокол RCON.
👉 https://habr.com/ru/articles/1081682/
🤣15👍8🐳3🔥2🌚1
✨ Как всегда, (почти) во всём виноват Internet Explorer
HTML хранит немало следов эпохи браузерных войн, старых платформ и давно забытых стандартов.
В статье собрана коллекция таких артефактов. От условных комментариев Internet Explorer до метатегов для Skype Toolbar, старых iOS и первых веб-приложений.
Многие из этих конструкций когда-то решали вполне реальные проблемы. Сегодня они уже не нужны, но продолжают встречаться в старой разметке, как своеобразные археологические слои веба.
👉 https://habr.com/ru/companies/ruvds/articles/1081440/
HTML хранит немало следов эпохи браузерных войн, старых платформ и давно забытых стандартов.
В статье собрана коллекция таких артефактов. От условных комментариев Internet Explorer до метатегов для Skype Toolbar, старых iOS и первых веб-приложений.
Многие из этих конструкций когда-то решали вполне реальные проблемы. Сегодня они уже не нужны, но продолжают встречаться в старой разметке, как своеобразные археологические слои веба.
👉 https://habr.com/ru/companies/ruvds/articles/1081440/
👍5❤1
✨ Разбор Route Resources
Мы уже писали, что в Angular появился новый подход к загрузке данных для маршрутов. В документации хорошо описано, как им пользоваться, но гораздо интереснее разобраться, как все работает изнутри.
В статье разбирается, что происходит с данными во время навигации, как Router обрабатывает переходы, их отмену и обновление данных.
👉 https://dev.to/playfulprogramming-angular/route-resources-in-angular-what-the-router-actually-does-with-your-signal-under-the-hood-2lc6
Мы уже писали, что в Angular появился новый подход к загрузке данных для маршрутов. В документации хорошо описано, как им пользоваться, но гораздо интереснее разобраться, как все работает изнутри.
В статье разбирается, что происходит с данными во время навигации, как Router обрабатывает переходы, их отмену и обновление данных.
👉 https://dev.to/playfulprogramming-angular/route-resources-in-angular-what-the-router-actually-does-with-your-signal-under-the-hood-2lc6
👍7❤2🔥2👏1😁1🤔1
✨ Polymorpheus: очень нужная деталька пазла Angular
Почти каждому знакома история, когда пишешь компонент, и кажется, что для тултипа или заголовка диалога хватит обычной строки. Потом внутрь просят добавить ссылку или картинку, потом этот же блок хочется переиспользовать на другой странице и API переписывается заново.
Александр Инкин показал, как перестать угадывать заранее. Он разобрал способы отображения данных, доступные в Angular из коробки, и пришел к выводу, что принципиальной разницы между ними нет, каждый просто берет контент и показывает его в некотором контексте.
Отсюда и выросла библиотека Polymorpheus, которую в Taiga UI используют повсюду. Компонент объявляет, что принимает контент, а дальше в него можно передать: примитивное значение, функцию, шаблон или отдельный компонент. Работает одинаково, переделывать ничего не нужно.
👉 https://habr.com/ru/articles/1082888/
Почти каждому знакома история, когда пишешь компонент, и кажется, что для тултипа или заголовка диалога хватит обычной строки. Потом внутрь просят добавить ссылку или картинку, потом этот же блок хочется переиспользовать на другой странице и API переписывается заново.
Александр Инкин показал, как перестать угадывать заранее. Он разобрал способы отображения данных, доступные в Angular из коробки, и пришел к выводу, что принципиальной разницы между ними нет, каждый просто берет контент и показывает его в некотором контексте.
Отсюда и выросла библиотека Polymorpheus, которую в Taiga UI используют повсюду. Компонент объявляет, что принимает контент, а дальше в него можно передать: примитивное значение, функцию, шаблон или отдельный компонент. Работает одинаково, переделывать ничего не нужно.
👉 https://habr.com/ru/articles/1082888/
❤8👍8😁1🤔1
✨ Новый класс моделей
Появилась альтернатива традиционным большим языковым моделям.
Если современные LLM оптимизированы для общения с человеком, то Jev вместо генерации текста, выдает типизированные структурированные решения, заточенные под автоматизацию внутри кода, а не под диалог с человеком.
Вместо последовательной генерации токенов, ответ формируется параллельно, что на порядки быстрее и дешевле классических LLM, при этом не допускаются ошибки и галлюцинации.
Такой подход особенно интересен для задач, где нейросеть должна принимать решения внутри системы: классифицировать и маршрутизировать данные, определять следующие шаги, работать в реалтайм приложениях.
Интересно, а под какие задачи вы бы попробовали применить эту модель?
👉 https://typesafe.ai/blog/introducing-system-one-models-and-jev
Появилась альтернатива традиционным большим языковым моделям.
Если современные LLM оптимизированы для общения с человеком, то Jev вместо генерации текста, выдает типизированные структурированные решения, заточенные под автоматизацию внутри кода, а не под диалог с человеком.
Вместо последовательной генерации токенов, ответ формируется параллельно, что на порядки быстрее и дешевле классических LLM, при этом не допускаются ошибки и галлюцинации.
Такой подход особенно интересен для задач, где нейросеть должна принимать решения внутри системы: классифицировать и маршрутизировать данные, определять следующие шаги, работать в реалтайм приложениях.
Интересно, а под какие задачи вы бы попробовали применить эту модель?
👉 https://typesafe.ai/blog/introducing-system-one-models-and-jev
😁8🔥4💩3👎2👏1
✨ Использование Jev для Agentic UI
Пока под новостью про Jev одни закидывают ее какашками, прагматичные программисты уже успели прикрутить модель к продакшену, и судя по цифрам, не зря. На тестах Jev обрабатывает запросы на порядок быстрее и обходится в разы дешевле.
У нее уже появился открытый конкурент Laya, модель на 421 млн параметров, которая требует меньше 1 ГБ памяти. Такой класс моделей хорошо подходит для локального выполнения, например в браузере, что позволяет убрать сетевую задержку.
Особенно интересна перспектива гибридного подхода, в идеале не придется вручную связывать два типа моделей между собой.
👉 https://www.angulararchitects.io/blog/using-jev-for-agentic-ui-just-a-trend-or-a-game-changer/
Пока под новостью про Jev одни закидывают ее какашками, прагматичные программисты уже успели прикрутить модель к продакшену, и судя по цифрам, не зря. На тестах Jev обрабатывает запросы на порядок быстрее и обходится в разы дешевле.
У нее уже появился открытый конкурент Laya, модель на 421 млн параметров, которая требует меньше 1 ГБ памяти. Такой класс моделей хорошо подходит для локального выполнения, например в браузере, что позволяет убрать сетевую задержку.
Особенно интересна перспектива гибридного подхода, в идеале не придется вручную связывать два типа моделей между собой.
👉 https://www.angulararchitects.io/blog/using-jev-for-agentic-ui-just-a-trend-or-a-game-changer/
🔥3❤1🤔1💩1
✨ Собираем домашний сервер для LLM дешевле RTX 3090
Блокировки аккаунтов, ограничения доступа и зависимость от сторонних сервисов заставляют все чаще задумываться о запуске нейросетей локально.
Но здесь возникает другая проблема. Современные нейросети требуют десятки гигабайт видеопамяти, а потребительские видеокарты могут стоить как подержанный автомобиль.
При этом для инференса нейросетей куда важнее объем и пропускная способность видеопамяти, чем поколение архитектуры. А у Tesla V100 с этим все в порядке, до 32 ГБ на карту и 900 ГБ/с пропускной способности. При этом сами карты на вторичке стоят копейки по сравнению с современными RTX.
👉 https://habr.com/ru/articles/1084234/
Блокировки аккаунтов, ограничения доступа и зависимость от сторонних сервисов заставляют все чаще задумываться о запуске нейросетей локально.
Но здесь возникает другая проблема. Современные нейросети требуют десятки гигабайт видеопамяти, а потребительские видеокарты могут стоить как подержанный автомобиль.
При этом для инференса нейросетей куда важнее объем и пропускная способность видеопамяти, чем поколение архитектуры. А у Tesla V100 с этим все в порядке, до 32 ГБ на карту и 900 ГБ/с пропускной способности. При этом сами карты на вторичке стоят копейки по сравнению с современными RTX.
👉 https://habr.com/ru/articles/1084234/
👍4❤3🤔1
✨ Полезные новшества ECMAScript 2026
На фоне постоянных новостей о нейросетях легко пропустить то, что сам JavaScript тоже продолжает развиваться. ECMAScript получает новую версию каждый год, и в ES2026 появилось немало небольших, но полезных улучшений.
Ни одно из изменений не переворачивает язык, но каждое убирает свой кусочек шаблонного кода. Перед использованием в проде стоит сверяться с поддержкой в конкретных рантаймах.
👉 https://habr.com/ru/companies/timeweb/articles/1081878/
На фоне постоянных новостей о нейросетях легко пропустить то, что сам JavaScript тоже продолжает развиваться. ECMAScript получает новую версию каждый год, и в ES2026 появилось немало небольших, но полезных улучшений.
Ни одно из изменений не переворачивает язык, но каждое убирает свой кусочек шаблонного кода. Перед использованием в проде стоит сверяться с поддержкой в конкретных рантаймах.
👉 https://habr.com/ru/companies/timeweb/articles/1081878/
👍2🎉1
✨ TLS‑сертификатам урезали жизнь до 47 дней
Утвержден график сокращения максимального срока действия публичных TLS-сертификатов: с 398 дней до 200 в 2026 году, затем до 100 дней в 2027-м и 47 дней в 2029-м.
В статье разбирается, что эти изменения означают для ИТ-инфраструктуры и почему ручное управление сертификатами постепенно перестает быть рабочим подходом.
👉 https://habr.com/ru/companies/clearway/articles/1085072/
Утвержден график сокращения максимального срока действия публичных TLS-сертификатов: с 398 дней до 200 в 2026 году, затем до 100 дней в 2027-м и 47 дней в 2029-м.
В статье разбирается, что эти изменения означают для ИТ-инфраструктуры и почему ручное управление сертификатами постепенно перестает быть рабочим подходом.
👉 https://habr.com/ru/companies/clearway/articles/1085072/
👍3🔥2😭1
✨ Кризис идентичности, или как Vue-разработчик мигрировал enterprise-проект на Angular 18
Миграция проектов на новую версию фреймворка редко сводится к простому обновлению зависимостей. Старый код, несовместимые библиотеки, изменения API и накопившийся технический долг превращают такую задачу в вызов.
К счастью в Angular есть схематики, которые частично автоматизируют миграцию и берут на себя значительную часть рутинных изменений.
Павел Барсуков рассказал о миграции большого Angular-проекта, которую он выполнял как разработчик с основным опытом во Vue. Получился живой практический рассказ о том, с какими неожиданными проблемами можно столкнуться и как их решать.
👉 https://habr.com/ru/companies/ppr/articles/1085816/
Миграция проектов на новую версию фреймворка редко сводится к простому обновлению зависимостей. Старый код, несовместимые библиотеки, изменения API и накопившийся технический долг превращают такую задачу в вызов.
К счастью в Angular есть схематики, которые частично автоматизируют миграцию и берут на себя значительную часть рутинных изменений.
Павел Барсуков рассказал о миграции большого Angular-проекта, которую он выполнял как разработчик с основным опытом во Vue. Получился живой практический рассказ о том, с какими неожиданными проблемами можно столкнуться и как их решать.
👉 https://habr.com/ru/companies/ppr/articles/1085816/
👍4