Новые реактивные формы в Angular: Signal Forms API

В 21 релизе Angular команда разработчиков представила экспериментальное API для построения реактивных форм с помощью сигналов. Тому, кто знаком с классическими Reactive Forms в Angular, новый Signal Forms API покажется эволюционным шагом: те же мощные возможности, но с сигналами — а значит, с автоматической реактивностью, полной типизацией и меньшим количеством шаблонного кода.

В статье вы узнаете, как с помощью сигналов теперь можно быстро создать типобезопасную форму, настроить валидацию с условными правилами, гибко управлять состояниями полей и легко встраивать кастомные компоненты-контролы.

#angular

@tproger_web
Читайте также в VK и Max

Разыскивая виновника, главное — не выйти на самого себя

@tproger_web
Читайте также в VK и Max

Это понравится дизайнерам: появился ИИ для создания векторной графики

Arrow 1.0 позволяет с помощью простого промпта создать изображение на чистом SVG. Такие изображения легко добавить в макет на сайте, сделать с ними лого, ну и подредактировать, если понадобится.

Работает бесплатно.

Эдди Османи из команды Google Chrome опубликовал отличную ретроспективу про историю развития Core Web Vitals. Если вы когда-нибудь оптимизировали LCP или пытались побороть сдвиги вёрстки ради зелёной зоны в Lighthouse, этот лонгрид стоит добавить в закладки.
​
Внутри собрано много закулисья о том, как интернет уходил от закрытого формата AMP к открытым стандартам:

— как исследователи выбирали пороги для метрик и почему отклик интерфейса должен занимать не больше 100 миллисекунд;
​
— каким образом показатели скорости стали частью алгоритмов ранжирования в поиске Google;
​
— сколько времени сэкономили пользователям все эти оптимизации (только за 2024 год набежало почти 30 тысяч лет ожидания).
​
Отдельный интерес для инженеров представляет блок про будущее оценки производительности. Османи подробно объясняет переход от старого показателя FID к более честному INP, который замеряет задержки ввода на протяжении всей сессии пользователя, а не только при первом клике.

Ссылка на статью: https://addyosmani.com/blog/core-web-vitals/

@tproger_web

Полноценный эмулятор процессора архитектуры x86 на чистом CSS? Да!

Никакого JavaScript или WebAssembly, все вычисления происходят исключительно силами браузерного движка стилей.

Как это реализовано технически:
— эмулятор исполняет реальный машинный код для процессоров 8086;
​— тактовый генератор построен на CSS-анимациях, поэтому система работает автономно и не требует от пользователя постоянно водить курсором по экрану;
​— логика работает благодаря новым спецификациям CSS, таким как условные операторы if(), стилевые запросы и кастомные функции

Вы даже можете запустить в этом эмуляторе собственные программы. Достаточно написать код на C и прогнать его через GCC с помощью скрипта из репозитория автора. На выходе вы получите готовый HTML-файл со стилями, внутри которого будет крутиться ваш бинарник.

Да, современный CSS действительно стал тьюринг-полным языком программирования. Но из-за использования экспериментальных функций запустить демку пока можно только в браузерах на базе Chromium.

Подробности на сайте.

#css

Любопытный факт: базовый комплект из 12 документов (сканы и фото основного разворота паспорта и страницы с пропиской, СНИЛС, ИНН, трудовой книжки, СТД-Р, военного билета, свидетельств ЗАГС о браке и рождении, диплома об образовании, загранпаспорта и водительского удостоверения) специальные OCR-программы могут распознать 100 раз за минуту на сервере без GPU.

Что для этого нужно, рассказывают здесь: https://tprg.ru/HVQO

@tproger_web
Читайте также в VK и Max

Репозиторий, в котором собраны лучшие практики по тестированию JavaScript и Node.js приложений

Подборка советов составлена на основе десятков статей, книг и инструментов:
— cтруктура тестов,
— тесты для бэкенда и микросервисов,
— UI-тесты для веб-компонентов,
— анализ эффективности тестов,
— настройка CI.

Сохраните, чтобы не потерять: https://github.com/goldbergyoni/javascript-testing-best-practices

#javascript #nodejs #тестирование

@tproger_web
Читайте также в VK и Max

Ох уж этот уникальный японский веб-дизайн

Японцы известны своим минимализмом, но в случае сайтов у них, почему-то, всё наоборот. Страницы пестрят всевозможными цветами, что уже нарушает 3 принципа дизайна, плюс на них используются мелкие иконки и мно-о-о-о-го текста.

Автор этого материала решила проанализировать с помощью ИИ какие паттерны дизайна сегодня существуют в мире. Это помогло разобраться в причинах такого необычного японского подхода к сайтостроению. Подробности в статье: https://habr.com/ru/companies/ruvds/articles/1003532/

#дизайн #ui

@tproger_web
Читайте также в VK и Max

Код для входа: какие джуны нужны в 2026 году

Рынок труда для новичков в ИТ больше не похож на открытые ворота. Это хорошо охраняемый объект с пропускной системой. Код для входа меняется каждый год. В 2026 году компаниям нужны не энтузиасты, а специалисты с конкретным набором «ключей» — это касается даже начинающих.

Кого на самом деле ищут работодатели: три типа джунов, которые получат оффер. Ключевые навыки 2026, алгоритм входа в профессию и анализ трендов рынка. Подробный лонгрид для начинающих и меняющих специализацию.

@prog_point (теперь ещё в VK и Max)

Ключевой нюанс якорного позиционирования в CSS

В CSS якорное позиционирование накладывает строгие правила на структуру DOM и последовательность элементов. Привязываемый элемент может появиться только после полной отрисовки якорного, поэтому важно тщательно продумывать их порядок и иерархию в документе.

Подробнее об этой особенности: https://frontendmasters.com/blog/the-big-gotcha-of-anchor-positioning/

#css

@tproger_web
Читайте также в VK и Max

Это уже какой-то вайб-сисадмининг получается

@tproger_web
Читайте также в VK и Max

Эволюция конечных автоматов: от кода-монстра к визуальным схемам

Когда процессы становятся сложнее, а классы разрастаются до тысяч строк, пора пересмотреть подход. В этой серии статей рассказывается, как перейти от императивного описания бизнес-логики к декларативному, используя конечные автоматы. Вы узнаете, как визуализировать процессы, упростить поддержку и масштабирование, а также почему классическая FSM не всегда подходит для реальных задач.

Часть 1
Часть 2

А вы используете конечные автоматы в своих проектах?

#бэкенд #фронтенд #архитектура

@tproger_web
Читайте также в VK и Max