Size Limit: контроль размера и скорости JS-бандла в CI
Инструмент
https://github.com/ai/size-limit?ref=console.dev
Инструмент
Size Limit измеряет не только размер JS, но и реальную стоимость его загрузки и выполнения в браузере. Его удобно подключать в GitHub Actions или другой CI, чтобы пул-реквесты не протаскивали тяжёлые зависимости и не ухудшали производительность.https://github.com/ai/size-limit?ref=console.dev
❤3🔥2
TanStack Router для React: типобезопасная маршрутизация, загрузчики и защита роутов
TanStack Router даёт маршрутизацию для современных React-приложений с полной типобезопасностью, автогенерацией
На практике это помогает собрать приложение с вложенными layout'ами,
https://www.freecodecamp.org/news/master-modern-react-routing-tanstack-router-crash-course/
TanStack Router даёт маршрутизацию для современных React-приложений с полной типобезопасностью, автогенерацией
routeTree.gen.ts, ленивой загрузкой и работой с query-параметрами без ручного парсинга строк. Это полезно, когда нужно ловить ошибки в путях и параметрах на этапе сборки, а не в проде, и при этом держать навигацию, загрузку данных и доступ к защищённым страницам в одном месте.На практике это помогает собрать приложение с вложенными layout'ами,
loader, useLoaderData, beforeLoad, router.invalidate() и защитой роутов, не утопая в useEffect и лишнем boilerplate. Для React-разработчика это хороший способ сделать роутинг чище, быстрее и удобнее для масштабирования.https://www.freecodecamp.org/news/master-modern-react-routing-tanstack-router-crash-course/
❤2👍2
Как рисовать system design диаграммы на Python
Для работы нужны
https://www.freecodecamp.org/news/how-to-create-system-design-diagrams-using-python/
Diagrams позволяет описывать архитектуру приложения кодом вместо ручной отрисовки: вы задаёте узлы, связи и группы, а на выходе получаете готовую схему. Это удобно для документации, потому что такие диаграммы легче хранить в Git, обновлять вместе с кодом и генерировать автоматически в CI/CD или при сборке документации.Для работы нужны
Python 3.7+, pip и Graphviz, после чего библиотека ставится через pip install diagrams. В коде используются Diagram, узлы вроде EC2, стрелки >>, <<, - для направления потока и Cluster для группировки слоёв, окружений или сервисов.https://www.freecodecamp.org/news/how-to-create-system-design-diagrams-using-python/
❤2
Cloudflare K2: serverless event streams
Cloudflare K2 — это сервис потоковой доставки событий, который хранит данные как упорядоченный лог и позволяет читать их нескольким потребителям независимо друг от друга. Он полезен там, где нужно не терять события при пиках нагрузки, сбоях или долгой недоступности downstream-сервисов, а ещё держать историю данных без собственного кластера брокеров.
K2 построен поверх
https://blog.cloudflare.com/cloudflare-k2-streams/?ref=console.dev
Cloudflare K2 — это сервис потоковой доставки событий, который хранит данные как упорядоченный лог и позволяет читать их нескольким потребителям независимо друг от друга. Он полезен там, где нужно не терять события при пиках нагрузки, сбоях или долгой недоступности downstream-сервисов, а ещё держать историю данных без собственного кластера брокеров.
K2 построен поверх
R2, поэтому отделяет вычисления от хранения и масштабируется без ручного управления инфраструктурой. Для продукта это означает более дешёвое и долговечное хранение, а на практике — удобный буфер для аналитики, антифрода, фоновой обработки и fan-out сценариев, где один поток событий читают сразу несколько систем.https://blog.cloudflare.com/cloudflare-k2-streams/?ref=console.dev
👍2
Bun 1.4.3: встроенная проверка типов и ускорение сборки
Bun v1.4.3 добавляет
Обновление также ускоряет
https://bun.com/blog/bun-v1.4.3
Bun v1.4.3 добавляет
bun check, встроенную проверку TypeScript, которая в реальных проектах работает в несколько раз быстрее tsc и заметно экономит память. Для повседневной разработки это значит более быстрый фидбек в bun run --check, bun test --check и bun build --check, когда ошибки типов ловятся до запуска кода или сборки.Обновление также ускоряет
node:http на больших ответах, JSON.parse, обработку отклонённых Promise, снижает простой CPU и память у bun build, а ещё добавляет Bun.FetchSession, экспериментальный Bun.ModuleGraph, поддержку If-Range в Bun.serve и новые опции вроде --disallow-code-generation-from-strings.https://bun.com/blog/bun-v1.4.3
🔥5
Deno присоединяется к Cloudflare для self-hosting Workers
Deno и Cloudflare объединяют усилия, чтобы упростить self-hosting
https://blog.cloudflare.com/deno-joins-cloudflare/
Deno и Cloudflare объединяют усилия, чтобы упростить self-hosting
Workers и Durable Objects и дать разработчикам один и тот же набор примитивов в большем числе окружений. Это важно, потому что такой подход снимает часть зависимости от одного провайдера и делает перенос и запуск приложений на своей инфраструктуре реальнее без смены модели разработки.celld и workerd станут основой для более удобной поддержки self-hosting, а в проекте будут использовать идеи и код из celld. Для разработчика это означает, что можно будет строить приложения в стиле Workers и при этом запускать их не только у Cloudflare, но и в собственном окружении.https://blog.cloudflare.com/deno-joins-cloudflare/
👍4❤1
Cloudflare Clef: модель для принятия решений по состоянию, а не генерации текста
Clef — это модель, которая превращает состояние системы в набор решений по заранее заданным вопросам. Она читает вход как текст, JSON, изображения или видео и за один проход возвращает вероятности по всем допустимым вариантам, без генерации свободного текста и без парсинга ответа.
Для веб-приложений это полезно там, где нужен предсказуемый выбор: маршрутизация обращений, разбор инцидентов, обработка инвойсов, оценка срочности или классификация по бизнес-правилам. Модель совместима с
https://huggingface.co/Cloudflare/clef
Clef — это модель, которая превращает состояние системы в набор решений по заранее заданным вопросам. Она читает вход как текст, JSON, изображения или видео и за один проход возвращает вероятности по всем допустимым вариантам, без генерации свободного текста и без парсинга ответа.
Для веб-приложений это полезно там, где нужен предсказуемый выбор: маршрутизация обращений, разбор инцидентов, обработка инвойсов, оценка срочности или классификация по бизнес-правилам. Модель совместима с
Jev и SystemOne, умеет работать через SGLang, а для более дешёвого и быстрого варианта есть Clef-Flash.https://huggingface.co/Cloudflare/clef
🔥4
Edge Functions стали в 5 раз быстрее благодаря MicroVMs
Netlify перевёл Edge Functions с v8 isolates на MicroVMs внутри своей edge-сети, чтобы снизить задержку, повысить надёжность и ускорить доставку логов. На тёплом вызове это дало примерно 5–6 мс вместо 25–40 мс на старой инфраструктуре, а изоляция на уровне MicroVMs лучше защищает разные деплои друг от друга.
https://www.netlify.com/blog/edge-functions-firecracker-microvms/
Netlify перевёл Edge Functions с v8 isolates на MicroVMs внутри своей edge-сети, чтобы снизить задержку, повысить надёжность и ускорить доставку логов. На тёплом вызове это дало примерно 5–6 мс вместо 25–40 мс на старой инфраструктуре, а изоляция на уровне MicroVMs лучше защищает разные деплои друг от друга.
https://www.netlify.com/blog/edge-functions-firecracker-microvms/
Анатомия уязвимостей API по OWASP API Security Top 10
OWASP API Security Top 10 показывает не только сами уязвимости, но и какие инженерные решения обычно приводят к их появлению. Это полезно тем, кто проектирует и пишет API: список помогает заранее закрывать типовые дыры вроде BOLA, слабой аутентификации, SSRF и ошибок в авторизации на уровне объектов и функций.
https://www.freecodecamp.org/news/engineering-anatomy-of-api-vulnerabilities-owasp-api-security-top-10/
OWASP API Security Top 10 показывает не только сами уязвимости, но и какие инженерные решения обычно приводят к их появлению. Это полезно тем, кто проектирует и пишет API: список помогает заранее закрывать типовые дыры вроде BOLA, слабой аутентификации, SSRF и ошибок в авторизации на уровне объектов и функций.
https://www.freecodecamp.org/news/engineering-anatomy-of-api-vulnerabilities-owasp-api-security-top-10/
👍3❤1
Как ускорить страницу с демо-видео и уложиться в 400 КБ на первом экране
Демо-видео на первом экране можно сделать быстрым, если отдельно оптимизировать сам ролик, постер и момент запуска. В этом кейсе страница стала грузить около 400 КБ вместо 3,1 МБ: видео сжали с 38 до 1,8 МБ, постер перевели в WebP, а автозапуск перенесли на первое действие пользователя, чтобы не тормозить LCP.
https://habr.com/ru/articles/1090594/
Демо-видео на первом экране можно сделать быстрым, если отдельно оптимизировать сам ролик, постер и момент запуска. В этом кейсе страница стала грузить около 400 КБ вместо 3,1 МБ: видео сжали с 38 до 1,8 МБ, постер перевели в WebP, а автозапуск перенесли на первое действие пользователя, чтобы не тормозить LCP.
https://habr.com/ru/articles/1090594/
👍4
Nuxt 4.6: шаг к независимости от Nitro и новый CLI
Nuxt 4.6 делает фреймворк заметно гибче для fullstack Vue-приложений: серверный слой больше не привязан жестко к Nitro, а сборка сервера через чистый Vite теперь доступна как экспериментальный вариант. Это упрощает выбор стека под проект и снижает зависимость от конкретной серверной обвязки, а встроенные сессии, поддержка Vue Vapor и новый Nuxt CLI 4.0 добавляют удобства в повседневной разработке.
https://nuxt.com/blog/v4-6
Nuxt 4.6 делает фреймворк заметно гибче для fullstack Vue-приложений: серверный слой больше не привязан жестко к Nitro, а сборка сервера через чистый Vite теперь доступна как экспериментальный вариант. Это упрощает выбор стека под проект и снижает зависимость от конкретной серверной обвязки, а встроенные сессии, поддержка Vue Vapor и новый Nuxt CLI 4.0 добавляют удобства в повседневной разработке.
https://nuxt.com/blog/v4-6
❤4
npm staged publishing теперь умеет создавать новые пакеты
npm staged publishing теперь позволяет создавать новый npm package без ручного первого publish и подходит для автоматизированных workflows. Для этого можно использовать local session или granular access token, включая stage-only token; первая версия попадает в staged queue и становится доступной только после промоушена мейнтейнером.
https://github.blog/changelog/2026-10-02-npm-staged-publishing-now-supports-creating-new-packages/
npm staged publishing теперь позволяет создавать новый npm package без ручного первого publish и подходит для автоматизированных workflows. Для этого можно использовать local session или granular access token, включая stage-only token; первая версия попадает в staged queue и становится доступной только после промоушена мейнтейнером.
https://github.blog/changelog/2026-10-02-npm-staged-publishing-now-supports-creating-new-packages/
The GitHub Blog
npm staged publishing now supports creating new packages - GitHub Changelog
You can now create a new npm package with npm stage publish, using a local session or a granular access token, including a stage-only token. This lets you create packages…
👏3👍1
diffnav: просмотр git diff в терминале с деревом файлов
diffnav — терминальный pager для git diff с подсветкой синтаксиса и деревом файлов, как в интерфейсе GitHub. Он помогает быстрее ориентироваться в больших изменениях: видно, какие файлы затронуты, и можно сразу перейти к нужному месту в diff без лишнего скролла.
https://github.com/dlvhdr/diffnav
diffnav — терминальный pager для git diff с подсветкой синтаксиса и деревом файлов, как в интерфейсе GitHub. Он помогает быстрее ориентироваться в больших изменениях: видно, какие файлы затронуты, и можно сразу перейти к нужному месту в diff без лишнего скролла.
https://github.com/dlvhdr/diffnav
GitHub
GitHub - dlvhdr/diffnav: A git diff pager based on delta but with a file tree, à la GitHub.
A git diff pager based on delta but with a file tree, à la GitHub. - dlvhdr/diffnav
🔥4
AI-виджет поддержки, который сам заводит баги в GitHub
Показан рабочий способ собрать виджет поддержки для React и Next.js, который принимает баги, вопросы и идеи, сохраняет их в своей базе, а потом помогает вручную отправлять только подтвержденные баги в GitHub. Такой подход нужен, чтобы не терять обращения из разных каналов и не создавать публичные issue с лишними личными данными.
https://www.freecodecamp.org/news/build-an-ai-support-system-that-automatically-routes-bugs-to-github/
Показан рабочий способ собрать виджет поддержки для React и Next.js, который принимает баги, вопросы и идеи, сохраняет их в своей базе, а потом помогает вручную отправлять только подтвержденные баги в GitHub. Такой подход нужен, чтобы не терять обращения из разных каналов и не создавать публичные issue с лишними личными данными.
https://www.freecodecamp.org/news/build-an-ai-support-system-that-automatically-routes-bugs-to-github/
❤6
Сниппет для поиска N+1 в Laravel
Когда N+1 прячется в шаблоне или ресурсе, его легко не заметить на локальной базе. Этот сниппет считает повторяющиеся SQL-запросы за один HTTP-запрос и помогает поймать регрессии до того, как они попадут в прод.
Учтите: запросы с разными значениями параметров здесь считаются одним и тем же SQL, а порог повторов нужно подбирать под ваш проект.
https://habr.com/ru/articles/1101198/
Когда N+1 прячется в шаблоне или ресурсе, его легко не заметить на локальной базе. Этот сниппет считает повторяющиеся SQL-запросы за один HTTP-запрос и помогает поймать регрессии до того, как они попадут в прод.
use Illuminate\Database\Events\QueryExecuted;
use Illuminate\Support\Facades\DB;
public function boot(): void
{
if ($this->app->isProduction()) {
return;
}
$seen = [];
DB::listen(function (QueryExecuted $query) use (&$seen) {
$seen[$query->sql] = ($seen[$query->sql] ?? 0) + 1;
});
}
Учтите: запросы с разными значениями параметров здесь считаются одним и тем же SQL, а порог повторов нужно подбирать под ваш проект.
https://habr.com/ru/articles/1101198/
❤4🔥1
Biome 2.6 добавил форматирование Markdown, YAML и SCSS
Biome 2.6, Rust-рантайм для форматирования и линтинга, научился приводить к общему стилю Markdown, YAML и SCSS. Для JavaScript-проектов также открыли предварительный доступ к плагинам с собственными правилами линта.
Поддержка линтинга для этих форматов пока начальная, а плагины для JavaScript ещё в developer preview. Если вы хотите заменить связку Prettier и ESLint одним инструментом, сначала проверьте, хватает ли ему ваших правил и конфигов.
https://biomejs.dev/blog/biome-v2-6/
Biome 2.6, Rust-рантайм для форматирования и линтинга, научился приводить к общему стилю Markdown, YAML и SCSS. Для JavaScript-проектов также открыли предварительный доступ к плагинам с собственными правилами линта.
Поддержка линтинга для этих форматов пока начальная, а плагины для JavaScript ещё в developer preview. Если вы хотите заменить связку Prettier и ESLint одним инструментом, сначала проверьте, хватает ли ему ваших правил и конфигов.
https://biomejs.dev/blog/biome-v2-6/
🔥3
CSS-Tricks собрал новые приёмы для CSS
Вышел свежий выпуск подборки CSS-Tricks с refraction-эффектами, scroll-state queries,
Часть приёмов работает не везде, а для некоторых нужен Chrome или свежие реализации контейнерных и scroll queries. Если вы используете такие техники в интерфейсе, проверьте поддержку и держите запасной вариант для Firefox и старых браузеров.
https://css-tricks.com/whats-important-19/
Вышел свежий выпуск подборки CSS-Tricks с refraction-эффектами, scroll-state queries,
@custom-media и другими новинками платформы. Внутри показывают, как собирать такие эффекты почти без JavaScript и где уже можно опираться на новые возможности браузеров.Часть приёмов работает не везде, а для некоторых нужен Chrome или свежие реализации контейнерных и scroll queries. Если вы используете такие техники в интерфейсе, проверьте поддержку и держите запасной вариант для Firefox и старых браузеров.
https://css-tricks.com/whats-important-19/
🔥3
TanStack Redact уменьшил браузерный runtime React
TanStack Redact 0.2.0 вышел как более компактная замена React и React DOM в браузере. Он подменяет браузерную часть React, а ваш код, компоненты и хуки остаются без изменений.
С TanStack Start, Vite, Vinext и Next.js он уже работает стабильно. У Redact синхронный рендеринг, поэтому обходится без time slicing и прерываемых обновлений.
https://tanstack.com/blog/introducing-tanstack-redact
TanStack Redact 0.2.0 вышел как более компактная замена React и React DOM в браузере. Он подменяет браузерную часть React, а ваш код, компоненты и хуки остаются без изменений.
С TanStack Start, Vite, Vinext и Next.js он уже работает стабильно. У Redact синхронный рендеринг, поэтому обходится без time slicing и прерываемых обновлений.
https://tanstack.com/blog/introducing-tanstack-redact
👍1
oxlint v1.89.0 усилил правила и исправил проверки
Вышел oxlint v1.89.0, линтер из проекта oxc, и в нём сразу поменяли набор рекомендованных правил для Vue 3, React, Next.js и TypeScript. Заодно исправили обработку lone surrogates в именах свойств и проверку строк, чтобы линтер не пропускал такие случаи и не ломал разбор.
Для некоторых правил поведение стало строже, поэтому после обновления стоит прогнать проект на новых предупреждениях и пересмотреть автопочинку. В Node.js TypeScript-поддержка теперь ограничена корректным диапазоном версий, а часть фиксов может вести себя иначе на уже существующем коде.
https://github.com/oxc-project/oxc/releases/tag/oxlint_v1.89.0
Вышел oxlint v1.89.0, линтер из проекта oxc, и в нём сразу поменяли набор рекомендованных правил для Vue 3, React, Next.js и TypeScript. Заодно исправили обработку lone surrogates в именах свойств и проверку строк, чтобы линтер не пропускал такие случаи и не ломал разбор.
Для некоторых правил поведение стало строже, поэтому после обновления стоит прогнать проект на новых предупреждениях и пересмотреть автопочинку. В Node.js TypeScript-поддержка теперь ограничена корректным диапазоном версий, а часть фиксов может вести себя иначе на уже существующем коде.
https://github.com/oxc-project/oxc/releases/tag/oxlint_v1.89.0
TanStack AI 1.0 вышел в стабильную версию
TanStack AI 1.0 стал стабильным релизом фреймворк-агностичного AI toolkit для чатов, инструментов и работы с медиа. Он даёт единые API и 23 адаптера под разные провайдеры, а для долгих сессий добавили новый agent harness.
Agent harness пока остаётся экспериментальным, поэтому его интерфейсы могут измениться без предупреждения. Для обычных сценариев уже можно брать стабильные API, а с harness лучше заходить осторожно и проверять совместимость перед внедрением.
https://tanstack.com/blog/tanstack-ai-1-0
TanStack AI 1.0 стал стабильным релизом фреймворк-агностичного AI toolkit для чатов, инструментов и работы с медиа. Он даёт единые API и 23 адаптера под разные провайдеры, а для долгих сессий добавили новый agent harness.
Agent harness пока остаётся экспериментальным, поэтому его интерфейсы могут измениться без предупреждения. Для обычных сценариев уже можно брать стабильные API, а с harness лучше заходить осторожно и проверять совместимость перед внедрением.
https://tanstack.com/blog/tanstack-ai-1-0
☃1👍1