Angular V20 стал на 35% быстрее

Привет, энтузиасты JavaScript!

Добро пожаловать в новое издание "На этой неделе в JavaScript"

На этой неделе мы раскручиваемся по поводу молниеносных функций Angular V20, капитального ремонта Framework Framework Remix и будущего JavaScript. У нас также есть обновленный список инструментов перегружать ваш рабочий процесс разработки, как всегда

Angular V20 сейчас на 35% быстрее

В Google ввода/вывода 21 мая 2025 года команда Angular объявилаУгловой V20запланировано на выпуск 29 мая. Эта версия значительно улучшает рендеринг на стороне сервера (SSR), сигналы и возможности авторизации, обеспечивая улучшенный опыт разработчика и оптимизированные производительность приложений.

Бесзоничный угловой (предварительный просмотр разработчика)

• Zone.js теперь необязательно:Угловые опоры работают без Zone.js, используя сигналы для точного обнаружения изменений.
• Эффективные обновления пользовательского интерфейса:Разработчики могут использовать осведомленность о состоянии MarkforChange или Signal для выявления целенаправленного обнаружения изменений.
• Пример включения режима без зонного:

typescript

bootstrapApplication(App, {

zoneless: true

});

Manual change detection invocation:

typescript

import { markForChange } from '@angular/core';

markForChange();

Улучшения экосистемы сигнала

• Сигналы и вычисленные стабильны:Рекомендуется для управления реактивным государством.
• LinkedSignal (стабильный в V20):Поддерживает записи, которые можно записать, с доступом к предыдущим ценностям состояния.

typescript

const count = signal(0);

const double = computed(() => count() * 2);

const history = linkedSignal([], (prev, next) => [...prev, next]);

• Ресурс и httpresource:Упростить асинхронное извлечение данных; StreamingResource поддерживает обновления пользовательского интерфейса в реальном времени.

typescript

const user = resource(async () => await fetchUser());

const posts = httpResource('/api/posts');

Улучшения на стороне сервера (SSR)

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

typescript

export const routes: Routes = [

{ path: '', component: HomeComponent, renderMode: 'ssr' },

{ path: 'about', component: AboutComponent, renderMode: 'client' }

];

• Покрементная гидратация:Позволяет отложить гидратацию компонентов с помощью блока отсрочки Angular, уменьшая начальный размер пакета JavaScript.
• Повторение события:Занимает и повторяет взаимодействие с пользователями во время загрузки JavaScript, чтобы предотвратить пропущенные события.

Авторизация опыта улучшения

• Автономные компоненты по умолчанию:Упрощает развитие, снижая зависимость от NGModules.
• Введение синтаксиса let:Предоставляет более чистый способ объявления шаблонных переменных.

xml

<ng-container *let="user of userSignal()">

{{ user.name }}

</ng-container>

• Негибные литералы для динамического стиля:Включает прямое связывание объектов динамического класса и стиля.

xml

<div [class]="{ active: isActive }"></div>

• Замена горячего модуля (HMR):Поддерживает состояние приложения во время перезагрузки разработки, повышая производительность разработчиков.

Новые интеграции и инструменты

• Экспериментальная поддержка Vite для тестирования:Предлагает более быстрые и модернизированные рабочие процессы разработки.
• Пользовательский угловой дорожку в Chrome Devtools:Пламенные диаграммы теперь включают в себя рамки с цветовой кодировкой для обнаружения угловых изменений и выполнения TypeScript.
• Приложение Firebase Hosting:Обеспечивает оптимизированное развертывание для приложений SSR.

Дополнительные основные моменты

• Запуск портала AI:Angular.dev/aiПредставляет рабочие процессы, управляемые AI, чтобы помочь угловым разработчикам.

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

Remix V3 и разрыв с React

Remix V2Powers React Router v7 с надежными возможностями рендеринга на стороне сервера, обеспечивая быстрые, масштабируемые приложения, используемые Shopify, Github и более 11 миллионов проектов по всему мируПолемЕго архитектура хорошо подходит для платформ электронной коммерции, блогов и других сайтов, управляемых контентом, что обеспечивает надежный опыт работы с полным стеком.

После тесной интеграции и возможного слияния ремикса в React Router V7, как подробно описано вОбъединение объявления, Remix v2 стал тонкой оберткой вокруг React Router. Эта консолидация позволила React Router унаследовать многие сильные стороны Remix, включая поддержку рендеринга на стороне сервера и React (RSC), создавая стабильную, проверенную боевой платформу с долгосрочной поддержкой.

Remix V3 отмечает значительный отход от этой модели. Он заменяет реагирование на легкую библиотеку Preact и охватывает первый подход, ориентированный на модель, низкозависимость. Это переосмысление минимизирует зависимость от тяжелых инструментов сборки, предпочитая выполнение времени выполнения, что делает его идеальным для приложений, управляемых искусственным интеллектом, легких веб-сайтов и современных рабочих процессов веб-разработки.

Ключевые особенности ремикса v3

• Интернет-ориентированный дизайн:Использование веб-стандартов и API-интерфейсов нативного браузера уменьшает сложность и сокращает кривую обучения, позволяя разработчикам сосредоточиться на создании, а не на основе абстракций.
• Минимальные зависимости:Придерживаясь философии «без зависимостей», Remix V3 освобождает разработчиков от внешних дорожных карт пакета и увеличивает контроль проектов.
• Модульная архитектура:Компоненты в комплекте, такие как разъемы базы данных и возрожденная библиотека UI, упрощают настройку и настройку. Одноцелевые модули обеспечивают легкое обмена или обновление деталей.
• Композиция и гибкость:Структура поощряет инструменты смешивания и сопоставления, предоставляя масштабируемый опыт разработчика, подходящий как для небольших, так и для крупных проектов.
• Производительность и надежность:Использование Google Preact подчеркивает стабильность и эффективность Framework. Оптимизация времени выполнения и уменьшенные размеры пакета способствуют более быстрому времени загрузки и более плавным опыту пользователя.
• Опыт разработчика:Исходя из многолетней экспертизы в веб-строительстве, Remix V3 фокусируется на простоте, ясности и производительности, стремясь сделать развитие интуитивно понятным и приятным.

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

Самое большое изменение JavaScript?

Временный API, современная замена для объекта Legacy Date JavaScript, находится в разработке в течение нескольких лет и теперь включена по умолчанию в Firefox 139, а более широкая поддержка выполнения ожидается в ближайшее время. Этот API решает давние проблемы с обработкой даты и времени, предлагая более надежный, точный и благоприятный для разработчиков подход.

Ключевые улучшения и функции

• Комплексная поддержка часового пояса:В отличие от традиционного объекта Date, временная поддерживает полные часовые пояса Iana, что обеспечивает точную обработку местных времен по всему миру.
• Неизменность:Все временные объекты неизменны, предотвращая непреднамеренные побочные эффекты и обеспечивают безопасность даты/времени/времени.
• Последовательный анализ и форматирование:Строгое соблюдение стандартов ISO 8601 обеспечивает надежный анализ и сериализацию по окружающей среде.
• Тонкая точность и расширенный диапазон:Поддерживает точность наносекунды и более широкий спектр дат, подходящих для высоких и исторических применений.
• Четкое разделение концепций даты/времени:Многочисленные специализированные классы, такие как Plaindate, Intaintime, PlainDateTime, ZoneDateTime и продолжительность, позволяют разработчикам точно работать с данными, которые им нужны без путаницы.

Пример

typescript

const date = Temporal.PlainDate.from("2025-05-23");

const oneWeekLater = date.add({ days: 7 }); // 2025-05-30

const dt = Temporal.PlainDateTime.from("2025-12-31T23:30");

const nextHour = dt.add({ hours: 1 }); // 2026-01-01T00:30

Введение временного API знаменует собой значительную эволюцию в обработке даты/времени/времени Javascript, что устраняет множество ловушек старого объекта даты, таких как ошибки DST, изменчивость и непоследовательный анализ. Его развертывание в Firefox 139 обеспечивает готовность к более широкому внедрению, обещание разработчиков является надежным стандартизированным набором инструментов для всех потребностей даты и времени в современных веб -приложениях.

Инструменты и релизы, о которых вы должны знать

Давайте скоро переживаем некоторые из других больших обновлений инструментов на этой неделе!

• Reactjust.DEV-минимальный, нулевой стартовый комплект React, сфокусированный на простоте и производительности. Он обеспечивает чистую, легкую основу с минимальными зависимостями, обеспечивая быструю настройку проекта без сложного инструмента. Предназначенные для разработчиков, которые хотят быстро запустить приложения React, он поддерживает современные функции React и лучшие практики из коробки. Идеально подходит для прототипов, небольших проектов или обучающих фундаментальных принципов, Reactjust.DEV, оптимизирует разработку, устраняя пакет и ненужную сложность, помогая вам эффективно сосредоточиться на создании приложения.
• BUN V1.2.15: проводят аудит BUN, чтобы поймать риски зависимости и просмотр PM Bun PM для понимания пакетов, исправляя 11 выпусков с 261 подсказками. Новый BUN_OPTIONS и NODE: VM Support Ungist Node.js Совместимость, идеально подходит для безопасных API или микросервисов.
• Ink 6.0: приносит построение пользовательского интерфейса в стиле React в приложения командной строки с макетами Flexbox, используя йогу для CSS-подобных конструкций. Он идеально подходит для создания интерактивных инструментов или сценариев CLI с полной поддержкой функций реагирования.
• JSPM 4.0: упрощает рабочие процессы ESM с помощью карт импорта, очистки TypeScript и сборов с нулевым конфигурацией для приложений для веб-стандартов. Его сосредоточение на местных модулях облегчает отладку и сохраняет будущие проекты.
• Faker 9.8: создает реалистичные поддельные данные, такие как имена, адреса и подробности криптографии в 70+ местах для тестирования или прототипирования. От названий до названий продуктов, это быстрый способ насмехаться над надежными наборами данных.

И это все для тридцати седьмого выпуска "На этой неделе в JavaScript. "

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