Updated and Ongoing Supply Chain Attack Targets CrowdStrike npm Packages

Снова крупный инцидент безопасности в npm-экосистеме. На этот раз злоумышленники получили доступ к публикации популярных пакетов и встроили туда червя, который заражает соседние пакеты и встраивает код, который крадет креды и крипту.

Атаке подверглись более 500 пакетов, в том числе крупные пакеты с десятками миллионов скачиваний в неделю

https://socket.dev/blog/ongoing-supply-chain-attack-targets-crowdstrike-npm-packages

#development #javascript #npm #security

Fetch streams are great, but not for measuring upload and download progress

Хорошая заметка от Джейка Арчибальда про потоковую загрузку данных в JS. Если коротко: потоковая загрузка поддерживается через fetch, но вы не сможете корректно посчитать прогресс. А если будете делать запрос через XHR - сможете!

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

Итак, как же все таки выполнить потоковую загрузку. В целом, все просто и не меняется давно: получаем Reader, и читаем из него куски данных

const response = await fetch(url);
const reader = response.body.getReader();

while (true) {
  const { done, value } = await reader.read();
  if (done) break;
  console.log(value);
}

console.log('Done!');

Можно даже использовать итераторы (но не в сафари)

const response = await fetch(url);

for await (const chunk of response.body) {
  console.log(chunk);
}

console.log('Done!');

Но, однако, вы не сможете корректно посчитать прогресс скачивания т.к. content-length, отдавемый сервером и длина контента, которую вы получаете в JS может отличаться из-за сжатия (по сети отправляются сжатые данные, а в JS вы получаете уже сырые данные)

Также можно использовать потоки и для загрузки данных на сервер. Например, у вас веб-приложение, которое обрабатывает видео на клиентском устройстве и только потом загружает его на сервер. В этом случае можно передать поток в body fetch'а

// Get a video from disk, or from the camera
const videoStream = getVideoStreamSomehow();
// Process it in some way, e.g. editing or transcoding
const processedVideo = videoStream.pipeThrough(new SomeVideoProcessor());

// Upload the stream
await fetch(url, {
  method: 'POST',
  body: processedVideo,
  duplex: 'half',
  headers: {
    'Content-Type': 'video/mp4',
  },
});

Но корректно замерять прогресс загрузки также не получится.

Единственный способ измерять прогресс сегодня - использовать XHR

const xhr = new XMLHttpRequest();

// Upload progress
xhr.upload.onprogress = (event) => {
  if (event.lengthComputable) {
    console.log(
      `Uploaded ${((event.loaded / event.total) * 100).toFixed(2)}%`,
    );
  }
};

// Download progress
xhr.onprogress = (event) => {
  if (event.lengthComputable) {
    console.log(
      `Downloaded ${((event.loaded / event.total) * 100).toFixed(2)}%`,
    );
  }
};

xhr.open('POST', url);
xhr.send(blobOrWhatever);

Но, уже ведутся обсуждения по добавлению такой возможности и в fetch

https://jakearchibald.com/2025/fetch-streams-not-for-progress/

#development #javascript #fetch #jakeArchibald #stream

Дайджест за 2025-09-22 - 2025-09-26

React Won by Default – And It's Killing Frontend Innovation
Статья о том, как выбор React дефолтным инструментом для проектов убивает фронтенд. Можно по-разному относится к тому факту, что React сегодня является стандартным инструментом для создания веб-приложений - это одновременно и благо и проклятье.


The expert Guide to Next.js Performance Optimization
Электронная книга от blazity про оптимизацию производительности в next.js приложениях. Книга бесплатная, чтобы получить - достаточно указать свою почту. Книжка не только про Next.js (хотя, конечно, большая часть связана с Next.js), рассказывается также и про шрифты, web vitals, инструменты измерения производительности, загрузку изображений и 3rd-party скрипты

Wasm 3.0 Completed
Вышел wasm 3.0! Основные фичи направлены на то, чтобы открыть возможность компилироваться в wasm различным языкам программирования. В частности, одна из фичей - встроенный сборщик мусора, который необходим языкам со сборщиком мусора. Это открывает возможность компиляции в Wasm для java-языков, Dart, Go


Updated and Ongoing Supply Chain Attack Targets CrowdStrike npm Packages
Снова крупный инцидент безопасности в npm-экосистеме. На этот раз злоумышленники получили доступ к публикации популярных пакетов и встроили туда червя, который заражает соседние пакеты и встраивает код, который крадет креды и крипту.

Fetch streams are great, but not for measuring upload and download progress
Хорошая заметка от Джейка Арчибальда про потоковую загрузку данных в JS. Если коротко: потоковая загрузка поддерживается через fetch, но вы не сможете корректно посчитать прогресс. А если будете делать запрос через XHR - сможете!

——————————————

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

State of QUIC in Node.js

HTTP/3, он же QUIC, придуманный чтобы заменить HTTP2 и ускорить веб с октября станет доступен в nodejs. В первый раз о поддержке QUIC в nodejs заговорили еще 6 лет назад, но только недавно openssl (поверх которого, видимо, nodejs обрабатывает http2) сделали поддержку quic

Штош, ждем новостей как кто-то переехал и ускорил свой трафик.

В статье коротко рассказывается про основные фишки QUIC и про то, почему так сложно сделать поддержку QUIC в nodejs

https://nodevibe.substack.com/p/state-of-quic-in-nodejs

#development #javascript #nodejs #quic

Using the node 18+ native test runner with TypeScript and React

Короткая заметка про то, что в текущей nodejs можно запускать юнит-тесты для React-компонентов, написанных на typescript, чисто на встроенном в nodejs тест-раннере. С помощью доп флагов nodejs поддерживает typescript (через вырезание типов) и транспиляцию jsx.

Ставим пакеты

pnpm add --save-dev @testing-library/react global-jsdom jsdom tsx

Пишем тесты

import React from "react";
import { describe, test } from "node:test";
import { strict as assert } from "node:assert";
import { render, fireEvent, screen, cleanup } from "@testing-library/react";
import { Toggle } from "./Toggle";

beforeEach(() => {
  cleanup(); // cleans the dom state between each test
});

describe("Toggle", () => {
  test("calls onToggleClick when clicked", () => {
    let callCount = 0;
    const { getByText } = render(
      <Toggle 
        options={["On", "Off"]}
        selected="On"
        onToggleClick={() => callCount++}
      />
    );
    
    fireEvent.click(getByText("On"));
    assert.equal(callCount, 1);
  });
});

Запускаем тесты

node --import global-jsdom/register --import tsx --experimental-transform-types --test src/components/Toggle.test.tsx

https://matthewbrown.io/2025/09/04/node-test-runner

#development #javascript #nodejs #typescript #jsx #testRunner #nodejsTestRunner

Behind The Scenes of Bun Install

Статья от Bun про то, как они оптимизировали установку npm-пакетов - в 7 раз быстрее npm, в 4 раза быстрее pnpm, в 17 раз быстрее чем yarn.

Статья хороша т.к. решение bun быстрое не на уровне алгоритмов, а на уровне правильного использования API операционки.

Одна из проблем - npm использует nodejs API для доступа к файловой системе. Это порождает 2 проблемы:
1. Эти операции проходят через очередь событий nodejs/libuv
2. Эти операции требуют перхода из user mode в kernel mode, т.е. операционка переключает контекст исполнения команды, что достаточно затратно (в статье приводится цена в 500 наносекунд для одного такого обращения для процессора с частотой 3ГГц)

Решение от bun - написали свое решение для доступа к файловой системе на zig и оптимизировали системные вызовы доступа к файлам. Там где yarn делает 4 миллиона системных вызовов, bun делает 165 тысяч.

Кроме самой установки пакетов bun также оптимизировал копирование закешированных пакетов в проект. Для разных ОС сделаны разные решения, гарантирующие быстрое копирование пакетов

Кроме этого, bun оптимизировали DNS-запросы. В npm запросы делают через nodejs API, что приводит к использованию очереди в libuv. Bun напрямую используют возможности ОС

Другая оптимизция - bun трансформирует package.json пакетов в бинарные данные, которые значительно ускоряют доступ к информации в package.json. Парсинг JSON достаточно хорошо оптимизирован современными инструментами, но он все равно медленее работы с бинарными данными.

Следующая оптимизация затрагивает скачку архивов. Обычно пакетные менеджеры скачивают архив с пакетом и на лету его извлекают. Т.к. итоговый объем распакованных файлов неизвестен, то пакетным менеджерам приходится алоцировать доп память, если извлеченные данные оказываются больше, чем ожидалось. Bun, вместо этого, скачивает полностью tarball, в конце tarball находится информация, показывающая сколько места занимают извлеченные данные, bun их считывает и аллоцирует необходимое пространство на диске.

Далее идет оптимизация, достаточно сложная - bun оптимизирует доступ к дереву зависимостей для CPU. Если хранить дерево как обычно, то CPU часто будет попадать мимо своих кешей и ходить в ОЗУ. Bun хранит дерево зависимостей в хитрых массивах, что оптимально для CPU-кеширования. Я, наверное, не справлюсь с правильным объяснением - лучше почитать самому.

https://bun.com/blog/behind-the-scenes-of-bun-install

#development #javascript #bun #npm #packageManagers

Deno 2.5: Permissions in the config file

Вышел Deno 2.5! Достаточно много разных изменений, главное из которых, имхо, возможность указывать наборы пермишнов (может ли приложение ходить в сеть или на файлуху) через конфиг.

Другие интересные изменения:
- Добавлены after и before хуки в Deno.test
- Добавлена возможность указывать заголовки в websocket
- Рантайм API для Deno.bundle
- Поддержка html как entrypoint для сборки
- Аудит-логи доступа к пермишнам (файлы, енвы, сеть)
- Возможность запуска setTimeout, setInterval, clearTimeout, clearInterval с интерфейсом nodejs (функции начнут возвращать nodejs-рефы на таймеры)
- --watch автоматически подтягивает изменения env-файла
- Дали возможность явно указать максимальное количество входящих TCP-соединений в очереди на обработку
- Улучшили перформанс разных API

https://deno.com/blog/v2.5

#development #javascript #deno #releaseNotes

Дайджест за 2025-09-29 - 2025-10-02

State of QUIC in Node.js
HTTP/3, он же QUIC, придуманный чтобы заменить HTTP2 и ускорить веб с октября станет доступен в nodejs. В первый раз о поддержке QUIC в nodejs заговорили еще 6 лет назад, но только недавно openssl (поверх которого, видимо, nodejs обрабатывает http2) сделали поддержку quic


Using the node 18+ native test runner with TypeScript and React
Короткая заметка про то, что в текущей nodejs можно запускать юнит-тесты для React-компонентов, написанных на typescript, чисто на встроенном в nodejs тест-раннере. С помощью доп флагов nodejs поддерживает typescript (через вырезание типов) и транспиляцию jsx.

Behind The Scenes of Bun Install
Статья от Bun про то, как они оптимизировали установку npm-пакетов - в 7 раз быстрее npm, в 4 раза быстрее pnpm, в 17 раз быстрее чем yarn.

Deno 2.5: Permissions in the config file
Вышел Deno 2.5! Достаточно много разных изменений, главное из которых, имхо, возможность указывать наборы пермишнов (может ли приложение ходить в сеть или на файлуху) через конфиг.

——————————————

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

React 19.2

Новый релиз React 19.2 принес достаточно интересные новшества: несколько фич для ускорения рендера или навигации, улучшения в девтулах, новые хуки.

Новый встроенный компонент <Activity>. Он позволяет скрыть дерево реакт компонентов как будто они удалены из кода, но при этом компоненты останутся в дереве реакт компонентов. (Если я неправильно понял доку - поправьте меня в комментариях). Это улучшенная версия условного рендеринга

// Before  
{isVisible && <Page />}  

  

// After  
<Activity mode={isVisible ? 'visible' : 'hidden'}>  
  <Page />  
</Activity>

Когда мы скрываем дерево - юзер перестаёт его видеть, вызываются отписки из useEffect, react перестаёт обновлять компонент. Когда мы снова показываем дерево - реакт делает ререндер и запускает useEffect.

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

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

Пример использования

function ChatRoom({ roomId, theme }) {
  const onConnected = useEffectEvent(() => {
    showNotification('Connected!', theme);
  });

  useEffect(() => {
    const connection = createConnection(serverUrl, roomId);
    connection.on('connected', () => {
      onConnected();
    });
    connection.connect();
    return () => connection.disconnect();
  }, [roomId]); // ✅ All dependencies declared (Effect Events aren't dependencies)
  // ...

Chrome devtools позволяют добавлять кастомные треки в профайлер перформанса. React начал добавлять туда работу шедулера и рендер компонентов. Вот это реально пушка, которая может сильно упростить дебаг перформанса рендера react-приложений.

Также в react добавили возможность пререндерить часть приложения. Я не до конца понял из доки, как это должно работать. Но вот что я понял: можно сделать пререндер части приложения и получить 2 куска кода. Один можно сразу отправлять клиенту (или отправлять ссылку на cdn с этим куском кода). В этом куске кода shell для запуска компонента. Второй кусок требуется для оживления компонента. В доке описаны несколько кейсов использования - стриминг с ноды и SSG


https://react.dev/blog/2025/10/01/react-19-2

#development #javascript #react

cleaning house in nx monorepo, how i removed 120 unused deps safely

Короткая заметка про то, как автор удалил 120 пакетов-зависимостей (около 25% от всего объема зависимостей в проекте) из монорепо используя knip. Knip - тул, который ищет неиспользуемые зависимости и код.

Сам процесс выпила зависимостей простой:
1. Запустить knip
2. Проверить, что то, что он пометил ненужным - это реально ненужная штука
3. Удалить ненужное
4. Проверить, что все работает
5. Goto 1

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

https://johnjames.blog/posts/cleaning-house-in-nx-monorepo-how-i-removed-120-unused-deps-safely

#development #javascript #nx #knip

How to detect Safari and iOS versions with ease in 2025

Статья в блоге злых марсиан о том, как правильно детектить версию ios и safari в коде. Если коротко подвести итог: проверять доступность фич, которые выходили в разных версиях ios и safari, хотя это может быть сложно и немного хрупко.

Если вам нужно отключить какой-то функционал для "старых" версий сафари, то предлагается такой фреймворк:
- Сначала проверьте, доступен ли gestureEvent. Если доступен - это webkit
- Затем найдите релиз ноутсы интересующей вас версии сафари
- в релиз ноутсах найдите фичу, на доступность которой можно написать проверку. Например, если вас интересуют версии сафари от 17 и выше, можно проверить поддержку contain-intrinsic-size
- проверьте, что все правильно работает

Как это выглядит в коде

Определяем что это вебкит

//  Desktop Safari, all mobile WebKit browsers on iOS and webview iOS
function isWebkit() { return "GestureEvent" in window; }

//  all mobile webkit browsers and webview iOS
function isMobileWebKit() { return "ongesturechange" in window; }

//  Desktop Safari
​​function isDesktopWebKit() {
  return (
    typeof window !== 'undefined' &&
    'safari' in window &&
    'pushNotification' in window.safari
  );
}

Определяем что это хотя бы 17 ios

// Use `CSS.supports` in Javascript or `@supports` in CSS to check if the feature is available.
// true on iOS 17.0+ (Safari 17.0+)
const isAtLeastiOS17 = CSS.supports("contain-intrinsic-size", "100px");

И теперь получаем возможность таргетироваться на версию сафари

if(isMobileWebKit()){
  if (isAtLeastiOS17) {
    // Safe to use iOS 17+ features
  } else {
    // Fallback for older iOS versions
  }
}

Иногда проверки могут быть сложнее т.к. проверить наличие поля в window или доступность css-свойства через support - недостаточно. В этом случае предлагается проверять поведение кода или элементов в реальном DOM.

https://evilmartians.com/chronicles/how-to-detect-safari-and-ios-versions-with-ease

#development #javascript #safari #browserDetection

modern-tar

modern tar - библиотека для работы с tar архивами. Работает в nodejs и браузерах. Поддерживает стриминг, создание и распаковку tar-архивов.

https://github.com/ayuhito/modern-tar

#development #javascript #library #github

Дайджест за 2025-10-07 - 2025-10-10

React 19.2
Новый релиз React 19.2 принес достаточно интересные новшества: несколько фич для ускорения рендера или навигации, улучшения в девтулах, новые хуки.

cleaning house in nx monorepo, how i removed 120 unused deps safely
Короткая заметка про то, как автор удалил 120 пакетов-зависимостей (около 25% от всего объема зависимостей в проекте) из монорепо используя knip. Knip - тул, который ищет неиспользуемые зависимости и код.


How to detect Safari and iOS versions with ease in 2025
Статья в блоге злых марсиан о том, как правильно детектить версию ios и safari в коде. Если коротко подвести итог: проверять доступность фич, которые выходили в разных версиях ios и safari, хотя это может быть сложно и немного хрупко.

modern-tar
modern tar - библиотека для работы с tar архивами. Работает в nodejs и браузерах. Поддерживает стриминг, создание и распаковку tar-архивов.

——————————————

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

Speculation Rules at Shopify

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

В shopify воспользовались этим API. Результат хороший - в тестовой группе ускорение открытия страницы составило в среднем 130мс для десктопа и 180мс для мобильного веба. Эффект на бизнес метрики то ли не обнаружили, то ли не смогли посчитать.

https://performance.shopify.com/blogs/blog/speculation-rules-at-shopify

#development #javascript #performance #preload

ffetch

ffetch - ещё одна библиотека для замены нативного fetch в коде. Эта библиотека предоставляет поддержку typescript, таймауты, ретраи с динамическим таймаутом между ретраями, хуки, менеджмент ошибок, мониторинг, circuit breaker и другие фичи. Выглядит недурно - все самое базовое и необходимое для сетевых запросов уже в комплекте.

Пример базового использования

import createClient from '@fetchkit/ffetch'

// Create a client with timeout and retries
const api = createClient({
  timeout: 5000,
  retries: 3,
  retryDelay: ({ attempt }) => 2 ** attempt * 100 + Math.random() * 100,
})

// Make requests
const response = await api('https://api.example.com/users')
const data = await response.json()

https://github.com/fetch-kit/ffetch

#development #javascript #github #fetch

Array.prototype.pushAll

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

Например

arr2.forEach(item => arr.push(item))

// или
arr.push(...arr2)

// или
for(const item of arr2) { arr.push(item)}

Но, как оказывается, есть нюанс.

В случае использования spread оператора arr.push(...arr2) все работает, но, т.к. каждый элемент массива arr2 надо теперь сделать отдельным аргументом, то это влечет за собой необходимость поработать js-движку. И, оказывается, есть обращения в github nodejs, когда чуваки спредят массивы из миллионов элементов и у них падает приложение из-за stack overflow

Окей, допустим спред не ок использовать для больших массивов, но ведь остается вариант с пушом в цикле. Но он тоже не без проблем. Т.к. добавление идет по одному элементу, js-движку может потребоваться несколько раз переалоцировать память. Для движка лучше если он сразу будет знать, сколько данных надо вставить в массив.

Это, наверняка, обходится с помощью первоначального указания новой длинны массива (arr.length += arr2.length), но это будут помнить малое количество разработчиков.

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


https://github.com/tc39/proposal-bulk-add-array-elements

#development #javascript #tc39

Дайджест за 2025-10-13 - 2025-10-15

Speculation Rules at Shopify
Shopify завершил тестирование использования Speculation Rules на своей платформе. Speculation Rules позволяют при загрузке страницы указать браузеру, какие еще файлы или страницы следует предзагрузить и с каким приоритетом. Например, если пользователь открыл корзину, логично предзагрузить ему страницу оплаты, чтобы при переходе на оплату все открылось моментально.


ffetch
ffetch - ещё одна библиотека для замены нативного fetch в коде. Эта библиотека предоставляет поддержку typescript, таймауты, ретраи с динамическим таймаутом между ретраями, хуки, менеджмент ошибок, мониторинг, circuit breaker и другие фичи. Выглядит недурно - все самое базовое и необходимое для сетевых запросов уже в комплекте.


Array.prototype.pushAll
Просто не смог пройти мимо. В tc39 обсуждают добавление в массивы метода pushAll для того, чтобы закидывать много элементов в конец массива. Сначала кажется, что делают какие-то странные вещи просто, чтобы они были. Ведь действительно, у нас уже хватает способов закидывать кучу элементов в массив одной строкой


——————————————

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

Bun 1.3

Вышел Bun 1.3. Основные фишки: улучшили поддержку фулстэк-разработки, встроили MySQL и Redis клиенты, улучшили работу с Cookie и роутингом, сделали улучшения для монорепо

Теперь обо всем по порядку

Если вы разрабатывается чисто фронтенд, то теперь достаточно запустить bun './**/*.html' и bun сделает транспиляцию и сборку всех исходников и сразу подтянет HMR. В релиз ноутсах также показывается насколько быстро работает HMR - текст на сайте обновляется мгновенное вместе с редактированием tsx исходника. Выглядит мощно.

Также в bun встроили простой роутинг и стриминг логов с браузера в терминал

import homepage from "./index.html";
import dashboard from "./dashboard.html";
import { serve } from "bun";

serve({
  development: {
    // Enable Hot Module Reloading
    hmr: true,

    // Echo console logs from the browser to the terminal
    console: true,
  },

  routes: {
    "/": homepage,
    "/dashboard": dashboard,
  },
});

Также фулстек приложения можно собирать в исполняемые файлы на разные ОС.

Появились новые хелперы для работы с SQL и новые встроенные DB-клиенты: mysql и redis. Встроенный redis-клиент в разы быстрее внешних библиотек (node-redis и ioredis). По замерам создателей Bun, конечно же. В любом случае - встроенная поддержка популярных СУБД это большой плюс.

Также много работ сделано в менеджере пакетов. В частности - внедрены isolated installs для монореп. Эта настройка делает так, что пакет не сможет достучатся до зависимости, которая не объявлена в его package.json. Эта настройка включена по дефолту. Если нужно вернуть старое поведение необходимо в конфиг bun добавить linker = "hoisted"

Также из интересного: добавили Security Scanner API. Теперь можно устанавливать внешние решения для аудита безопасности пакетов.

Еще сделали большой блок изменений во встроенный в Bun тест-реймворк. Во первых, сделали официальное расширение для VSCode, которое интегрирует bun test в VS Code Test Explorer UI, т.е. тесты можно запускать из UI vscode и там же смотреть результаты. Во вторых - дали явную возможность помечать тесты, как готовые для запуска в параллельном режиме или как требующие последовательного запуска. Это крайне полезно. По умолчанию в параллель запускаются не более 20 тестов, но это значение можно изменить. Важное отличие новой фичи от того, что уже есть в vitest или jest - можно запускать в параллель тесты, написанные в одном файле. Это, конечно, не новая фича (условный ava умеет такое с самого начала, если я правильно помню), но все равно звучит полезно.

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

test.failing("known bug: division by zero", () => {
  expect(divide(10, 0)).toBe(Infinity);
  // This test currently fails but is expected to fail
  // Remove .failing when the bug is fixed
});

test.failing("TDD: feature not yet implemented", () => {
  expect(newFeature()).toBe("working");
  // Remove .failing once you implement newFeature()
});

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

https://bun.sh/blog/bun-v1.3

#development #javascript #bun #releaseNotes

React Compiler v1.0

Вышел React Compiler v1.0. Его можно поставить и, по заверениям разработчиков, забыть о ручном менеджменте useMemo, useCallback, React.memo в 99% кейсах - теперь эту работу должен забрать на себя React Compiler. В остальных 1% кейсов можно заняться ручной оптимизацией для достижения лучших результатов.

React Compiler уже используется в приложениях. Например в Meta Quest Store - магазин приложений для VR гарнитуры Oculus Quest. Использование React Compiler ускорило работу навигации на 12%, а некоторые взаимодействия ускорились в 2.5 раза.

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

https://react.dev/blog/2025/10/07/react-compiler-1

#development #javascript #react #reactCompiler

Oxlint JS Plugins Preview

Oxlint представили API для плагинов на JS. При этом есть 2 версии API - частично совместимое с Eslint, что позволяет подключить eslint-правила в oxlint без доп приседаний, и oxlint API, которое позволяет делать более производительные правила.

Пока что это превью, поэтому нет полноценной поддержки eslint API и плюс есть еще куда ускорится. Тем не менее, переход на oxlint в моменте даст значительное ускорение - даже с кастомными плагинами oxlint работает в 15 раз быстрее eslint.

При этом API плагинов для oxlint не сильно отличается от eslint. С миграцией кода с eslint на oxlint вполне справится любая LLM. С точки зрения разрабов oxlint было бы правильно выложить prompt или rules для переписывания правил на основе LLM или AI-агентов.

https://oxc.rs/blog/2025-10-09-oxlint-js-plugins.html

#development #javascript #oxlint #eslint