✨ Тюнинг производительности Angular

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

В ней вы узнаете, как сгенерировать performance profile и разделить приложение на части.

👉 https://blog.angular-university.io/angular-performance-tuning/

✨ Signal Forms

Использование сигналов для создания форм — возможно отличный вариант, который может обеспечить достаточную гибкость.

Новая библиотека Signal Forms берет идеи из Template Driven Forms и Reactive Forms и добавляет сигналы. Она все еще находится в процессе разработки, любая обратная связь и помощь в реализации приветствуется.

👉 https://timdeschryver.dev/blog/bringing-the-power-of-signals-to-angular-forms-with-signal-forms

✨ Angular на стероидах

Иногда требуется выполнить задачу, которая в JavaScript завершается не слишком быстро.

В статье продемонстрировано, как с легкостью использовать WebAssembly внутри приложения, написанного на Angular.

👉 https://habr.com/ru/companies/piter/articles/796329/

✨ Сравнение utility types библиотек или TypeScript на стероидах

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

В статье рассказывается о сторонних utility types библиотеках, которые могут сэкономить время на типизацию.

👉 https://habr.com/ru/articles/794410/

✨ Attribute Injection

В Angular 17.3.0-next.1 появился новый класс HostAttributeToken, позволяющий внедрять атрибуты аналогично @Attribute.

Его можно использовать следующим образом:

import {HostAttributeToken, inject} from '@angular/core';

class MyDir {
  someAttr = inject(new HostAttributeToken('some-attr'));
}

Новый API ведет себя аналогично декоратору @Attribute, с одним существенным отличием: он выбрасывает DI-ошибку, если атрибут не существует, а не возвращает null.

👉 https://netbasal.com/streamlining-attribute-injection-in-angular-the-hostattributetoken-approach-494f5c1428b8

✨ Типизированные реактивные формы

Всегда лучше получить предупреждение заранее, если ваша форма не валидна.

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

👉 https://angularindepth.com/posts/1527/strongly-typed-reactive-forms-in-angular

✨ Оптимизируем изображения

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

В статье рассказывается о том, как работает директива NgOptimizedImage и инструменты, которые она предоставляет.

👉 https://angularindepth.com/posts/1522/the-who-what-where-when-why-and-how-of-image-optimization-in-angular

✨ Тип never и обработка ошибок в TypeScript

Если упускать из виду некоторые фундаментальные особенности never. Это может привести к ошибкам в коде, которые могут проявиться в проде.

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

👉 https://fettblog.eu/typescript-never-and-error-handling/

✨ Почему сигналы не заменят RxJS

Учитывая интерес к сигналам, можно подумать, что Angular движется к полному удалению RxJS. Однако сигналы способны заменить только синхронные части RxJS, но не асинхронные, а при создании приложений лучше всего сочетаются эти два подхода.

В статье объясняется, почему RxJS не будет заменен сигналами и останется библиотекой, доступной для разработчиков.

👉 https://angular.love/en/why-angular-signals-wont-replace-rxjs/

✨ Анонс TypeScript 5.4

В новом релизе: улучшили сужение типов, добавили утилитарный тип NoInfer, Object.groupBy и Map.groupBy, так же множество других изменений.

В ближайшие месяцы команда TS будет работать над версией 5.5. Вы можете ознакомиться с их планом на GitHub.

👉 https://devblogs.microsoft.com/typescript/announcing-typescript-5-4/

✨ Директива-контекст

Если вы все еще игнорируете кастомные директивы в Angular.

Алан Маркевич показал, как с помощью них можно расширить функционал ваших компонентов, улучшив DX.

👉 https://habr.com/ru/articles/799063/

✨ Необычный RxJS

RxJS содержит в себе более 100 операторов, но скорее всего, вы пользуетесь небольшой их частью.

В статье приведены примеры использования редких операторов.

👉 https://habr.com/ru/articles/799171/

✨ Оператор satisfies в TypeScript

В версии TypeScript 4.9 появился оператор satisfies, который за последние месяцы набирает все большую популярность.

В статье попытка ответить на вопрос, когда его применять.

👉 https://dev.to/this-is-learning/a-deep-dive-into-the-satisfies-operator-in-typescript-1b3n

✨ Angular и микрофронтенды

Подход с микрофронтендами в основном используется крупными корпорациями, которые работают с масштабными продуктами.

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

👉 https://angular.love/en/angular-micro-frontends-a-modern-approach-to-complex-app-development/

✨ Ленивые бесконечные списки на основе Deferrable Views

В отличие от постраничной навигации, создание бесконечных списков содержит ряд подводных камней и технических сложностей.

Павел Сапачёв рассказал о различных подходах в реализации списков.

👉 https://habr.com/ru/companies/tinkoff/articles/800201/

✨ Что нового в Angular 17.3

На днях вышла версия 17.3, которая принесла множество изменений.

В этой статье перечислены наиболее важные из них.

👉 https://dev.to/this-is-angular/whats-new-in-angular-173-1148

✨ Создание консоли освещения

Консоль освещения используется для управления несколькими сценическими светильниками одновременно.

Это история о том, как она разрабатывалась с помощью Angular и NativeScript.

👉 https://blog.angular.io/angular-with-nativescript-creating-the-blackout-lighting-console-1cf6a030b896

✨ Изучаем NoInfer

В TypeScript 5.4 появился новый утилитарный тип под названием NoInfer.

Давайте посмотрим, как его использовать, чтобы улучшить поведение TypeScript в определенных ситуациях.

👉 https://www.totaltypescript.com/noinfer

🚀 Анонс AnalogJS 1.0

После долгих месяцев разработки и тестирования недавно было объявлено о первом мажорном выпуске AnalogJS.

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

👉 https://dev.to/analogjs/announcing-analogjs-10-19an

✨ Типизация Array.reduce

Есть одна распространенная проблема, которая возникает в TS всякий раз, когда вы пытаетесь использовать reduce для преобразования массива в объект.

Давайте попробуем ее решить.

👉 https://www.totaltypescript.com/how-to-type-array-reduce