Решил поделиться с вами парой интересных новостей, на которые наткнулся на этой неделе.

1) Кажется, что Angular начал смотреть в сторону реактивных систем по типу mobx, meteor и vue.

Было бы интересно услышать, что об этом RFC думают те, кто писали на angular 2+.

https://github.com/angular/angular/discussions/49090

2) React hook form движется в сторону framework agnostic решения для валидации, что очень круто. Уже вынесли core в отдельный пакет.

https://github.com/react-hook-form/core

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

#devtips #news

Всем привет!

Делюсь с вами недавними новостями в мире фронтенда, которые мне показались интересными.

- React хочет сделать публичным prop unstable_expectedLoadTime для Suspense. Его главная задача в том, чтобы не рендерить поддерево компонентов при первой загрузке, а показать фолбэк.

Подробнее про фичу можно почитать тут:
https://github.com/facebook/react/pull/19936

- Вышел новый проект ts-reset, который патчит дефолтные типы TS и делает их более безопасными.

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

https://github.com/total-typescript/ts-reset

- Оказывается chrome в headless моде (без визуала - puppeteer и тд.) был отдельным браузером, а не другим билдом.

Вот наконец объединили 2 проекта в один:
https://developer.chrome.com/articles/new-headless/

#devtips #news

Итак, друзья.

Делюсь новостями фронта за эту неделю, которые мне показались интересными.

Deno выпустила версию 1.31 с поддержкой package.json. Теперь работать с npm пакетами будет намного проще. Кажется, что они работают над тем, что максимально просто было мигрировать с node проектов на deno.
https://deno.com/blog/v1.31

Также наткнулся на статью про релиз Astro 2.1, там ничего особенного нету. Однако из нее я узнал про такой формат, как marcdoc от stripe. Поддержку его добавили из-за перформанса, но в целом интересно посмотреть, насколько он станет популярен.
https://astro.build/blog/astro-210/#built-in-image-support

Статья от Astro про перфоманс различных фреймворков.
https://astro.build/blog/2023-web-framework-performance-report/

Vercel поделился причиной, почему Turborepo съезжает с go на rust. Думаю вам тоже будет интересно почитать.
https://vercel.com/blog/turborepo-migration-go-rust

#devtips #news

Из интересных вещей, на которые я наткнулся на этой неделе, помимо gpt-4 - это вот этот ПР в react.

В нем наконец-то убирают warning про использование useLayoutEefect во время SSR.

В плане use case’ов тут все ясно, если тебе реально нужен замер позиции элемента при первом рендере, чтобы правильно спозиционировать какой-то элемент, то лучше вообще скрывать этот компонент на сервере.

Однако зачастую useLayoutEffect (особенно в библиотеках) используется для синхронизации ref’ов или еще каких-то действий, никак не связанных с замерами.

В итоге все просто пилили костыли по типу useIsomorphicLayoutEffect, просто чтобы не было лишних ворнингов.

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

Да и так думаю, загуглить такое должно быть не сложно (ну или спросить ChatGPT).

А что думаете вы по этому поводу?

#devtips #news

Всем привет!

Наткнулся сегодня на интересную статью в блоге реакт, про то, над чем сейчас работает команда React.

В целом, очень много интересных вещей. Однако меня больше всего заинтересовал React Forget.

Очень интересно, какой код он будет выдавать на выходе. Так как можно придумать много разных кейсов, когда “наивная” мемоизация не совсем подходит.

Взять даже вот такой код:

function getValue({a, b}) {
    // ...
}

const Component = ({object}) => {
    const result = getValue(object)
}

Очевидный output здесь будет:

function getValue({a, b}) {
    // ...
}

const Component = ({object}) => {
    const result = useMemo(() => getValue(object), [object]);
}

Хотя хочется видеть:

function getValue({a, b}) {
    // ...
}

const Component = ({object}) => {
    const result = useMemo(() => getValue({a: object.a, b: object.b}), [object.a, object.b]);
}

Может оно так и будет работать на самом деле. Однако есть большие сомнения касательно прозрачности.

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

В общем, пока нету публичной реализации - сложно что-то понять на 100%.

Буду рад услышать ваше мнение по поводу React Forget и других грядущих фич.

https://react.dev/blog/2023/03/22/react-labs-what-we-have-been-working-on-march-2023

#devtips #news

Всем привет!

Сегодня не успел выложить видос, поэтому делюсь новостями за эту неделю.

Import maps теперь поддерживаются всеми движками.
https://web.dev/import-maps-in-all-modern-browsers/

Playwright добавили ui мод, очень крутая фича для написания и дебага e2e тестов. На playwright тесты на текущем месте не пишем, но если бы писали - был бы в двойне рад.
https://github.com/microsoft/playwright/releases/tag/v1.32.0

Vercel уже добавили поддержку http streaming для lambda и edge. Кажется, начинают готовить инфраструктуру для React Server Components.
https://vercel.com/blog/streaming-for-serverless-node-js-and-edge-runtimes-with-vercel-functions

Также смотрю часто говорят про million.js (более быстрая реализация virtual dom, которая может работать с React), у них уже 2-я версия вышла. Пока еще не смотрел детально, но выглядит, как что-то интересное.
https://dev.to/aidenybai/unleashing-millionjs-v200-2f96

В остальном, особо много не поглощал контента на этой неделе, так что буду рад услышать, что интересного нашли вы?

#devtips #news

Всем привет!

Сегодня наткнулся на статью, от chrome, где они презентуют WebGPU - API для проведения вычислений на GPU.

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

На самом деле очень рад данным изменениям. Возможно photoshop теперь наконец выпустят свою веб версию).

https://developer.chrome.com/blog/webgpu-release/

#devtips #news

Всем привет!

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

А пока давайте поговорим про Angular и их большой скачок в версии 16. Буквально сегодня пока общались с бывшими коллегами затронули тему ангуляра и не могли вспомнить, какая у них сейчас последняя версия.

Мой ресерч как раз привел на их статью о релизе превью для 16-й версии, и я прямо реально удивлен.

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

Хотя... вроде бы в 12-ой версии они уже начали тестировать esbuild, тут думаю меня поправят, если память мне изменяет.

Однако 16-ая версия выглядит реально круто. Добавили сигналы и их интеграцию с observables из rxjs, сборку с помощью esbuild для прода и vite для дева, clients-side гидрацию (был удивлен, что ее не было до этого).

Подробнее можно почитать тут:
https://blog.angular.io/angular-v16-is-here-4d7a28ec680d

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

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

Как-то так. Всем хорошего вечера!

#devtips #news