Полка браузера: что брать из npm, когда платформы мало

Полка устроена так же, как вся часть II: сначала то, что браузер даёт сам, и только за стеной — пакет. Ниже девять задач, и у каждой в своём разделе паспорт одного вида: когда библиотека не нужна, что умеет платформа и какой у этого статус Baseline, где в учебнике своя сборка, снимок версий с датой проверки и условие, при котором строку пора пересмотреть.

В таблицах-снимках есть столбец «Вес или цена». Вес — это сколько байт уедет пользователю, когда сборщик склеит модули в один файл, минификатор сожмёт код, а сервер отдаст его в gzip. Килобайт там — 1024 байта, склеивал esbuild 0.28.2, и мерился типичный импорт: в скобках записано, что именно импортировали, потому что другой набор импортов даёт другой вес. Как сборщик склеивает модули и что выбрасывает по дороге, разбирает глава «Сборка» части IV, начиная со статьи «Свой сборщик». Где вес не мерили, так и сказано, и названа цена другого рода — лицензия.

Библиотека на полке — не награда, а временное решение: у каждого раздела записано событие, после которого его пора переписать.

Мерило знакомо с первой статьи части: статусы Baseline Widely, Newly и Limited, подробно разобранные в прологе. Правило, что делать с каждым статусом, когда на кону пакет, записано в статье «Живой ли пакет», в вопросе 0, — здесь его не повторяем и добавляем одно браузерное уточнение. Safari на iPhone обновляется только вместе с iOS, а старые телефоны на Android со временем перестают получать свежий Chrome. Поэтому Newly на этой полке — всегда с запасным путём. Статусы взяты из web-features 3.38.0 — набора данных, из которого берутся отметки Baseline.

Как узнать, что умеет браузер у читателя, разбиралось там же: спросить саму возможность, а не имя браузера. Спросим браузер, в котором вы это читаете, о пяти вещах с этой полки. Прогноз: что он ответит?

// что умеет браузер, в котором вы это читаете: проверка возможности, а не имени браузера
const probes = [
  ["Temporal", typeof Temporal !== "undefined"],
  ["setHTML (Sanitizer API)", "setHTML" in Element.prototype],
  ["anchor positioning", CSS.supports("anchor-name", "--tip")],
  ["popover", "popover" in HTMLElement.prototype],
  ["Object.groupBy", typeof Object.groupBy === "function"],
];

for (const [name, supported] of probes) {
  console.log(`${name}: ${supported ? "есть" : "нет"}`);
}

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

Строка про anchor positioning учит второму: «есть» — ещё не «можно». CSS.supports проверяет одно свойство в одном браузере, а Baseline оценивает возможность целиком, со всеми её свойствами, во всех основных браузерах. Целиком anchor positioning, по web-features 3.38.0, пока не поддерживает ни один браузер, поэтому в разделе о поповерах она проходит как не Baseline. Проба решает, какой путь включить у этого читателя. Нужен ли запасной путь вообще, решает статус.

Когда возможности нет, путей два, и стареют они по-разному. Полифил дописывает браузеру недостающий стандарт: строка import "temporal-polyfill/global" ставит глобальный Temporal, и дальше код пишется так, будто браузер умеет его сам. Когда Temporal появится в Safari, эту строку удалят, а остальной код не тронут. Библиотека вроде date-fns — не стандарт, а свои функции, и её вызовы останутся в каждом файле, где считают даты. Поэтому там, где стандарт уже в пути, полку открывает полифил.

И правило о том, как стареет сама полка. «Платформа умеет» почти не стареет: возможности в браузерах только прибавляются. Стареет «пока не умеет»: сегодня в Safari нет Temporal, через год он может там появиться, и тогда раздел о датах будет врать. Поэтому каждое такое утверждение записано на полке вместе с условием пересмотра — строкой «Пересмотреть, если…» в конце раздела.

Спрашивайте возможность, а не имя браузера. А «пока не умеет» записывайте вместе с условием, при котором проверить снова.

Не нужна, если дату надо только показать: хватит Intl. Платформа: Intl.DateTimeFormat — часть Intl, Widely; Intl.RelativeTimeFormat — Widely с 16.03.2023; Intl.ListFormat — Widely с 26.10.2023; Intl.DurationFormat — Newly с 04.03.2025. Temporal не Baseline: он есть в Chrome и Edge с версии 144 и в Firefox с 139, а в Safari его нет.

Своя сборка уже была: показ даты через Intl.DateTimeFormat и сеттеры, которые переносят дату через границу месяца. В той статье перечислено, ради чего берут библиотеку: разбор строк, «через два месяца», чужие часовые пояса, «3 дня назад». Часть этого списка Intl закрывает сам. Пример показывает время в двух поясах, «вчера», цену в рублях и список. Прогноз: какое время будет во Владивостоке и что Intl поставит между «деньги» и «списки»?

const at = new Date(Date.UTC(2026, 8, 14, 9, 30)); // 14 сентября 2026, 09:30 по Гринвичу

const moscow = new Intl.DateTimeFormat("ru-RU", { dateStyle: "long", timeStyle: "short", timeZone: "Europe/Moscow" });
const vladivostok = new Intl.DateTimeFormat("ru-RU", { timeStyle: "short", timeZone: "Asia/Vladivostok" });
console.log(moscow.format(at), "| во Владивостоке", vladivostok.format(at));

const ago = new Intl.RelativeTimeFormat("ru", { numeric: "auto" });
console.log([ago.format(-1, "day"), ago.format(-3, "day"), ago.format(2, "month")].join(" · "));

const price = new Intl.NumberFormat("ru-RU", { style: "currency", currency: "RUB", maximumFractionDigits: 0 });
console.log(price.format(1499), "·", price.format(1234567));

const list = new Intl.ListFormat("ru", { type: "conjunction" });
console.log(list.format(["даты", "деньги", "списки"]));

Оговорка к этому выводу: снят он в Chrome 152, Firefox 155 дал то же самое, а на старых Android и iOS, где и данные CLDR старые, «г.», пробелы и порядок слов могут выйти иначе — такие движки мы не проверяли.

Стена — арифметика. «31 января плюс месяц» Date превращает в 3 марта, и Intl здесь не поможет: он только показывает. Вот та же операция в date-fns, в Temporal из полифила и в голом Date:

import { addMonths, format, formatDistanceStrict } from 'date-fns';
import { ru } from 'date-fns/locale';
import { Temporal } from 'temporal-polyfill';

const jan31 = new Date(2026, 0, 31);
console.log('date-fns:', format(addMonths(jan31, 1), 'd MMMM yyyy', { locale: ru }));
console.log('date-fns:', formatDistanceStrict(new Date(2026, 8, 14), new Date(2026, 8, 11), { locale: ru, addSuffix: true }));
console.log('Temporal:', Temporal.PlainDate.from('2026-01-31').add({ months: 1 }).toString());
const d = new Date(2026, 0, 31);
d.setMonth(d.getMonth() + 1);
console.log('Date:', d.toLocaleDateString('ru-RU'));

date-fns и Temporal упираются в последний день февраля, Date уезжает в март. Вторая строка показывает, что date-fns умеет и относительное время, но для показа хватает RelativeTimeFormat из примера выше.

Роли у трёх строк разные. temporal-polyfill — стандарт, который уйдёт сам, когда Temporal будет везде. date-fns — функции над обычным Date для кода, который пишется сейчас и не хочет ждать Safari. dayjs — запас с особой ролью: описание пакета в реестре называет его заменой Moment.js с тем же API, поэтому это путь для старого кода на moment, который стоит в разделе «Сошли с полки». Luxon здесь нет не из-за качества — причина в разделе «Не на полке и почему».

Пересмотреть, если Temporal появится в Safari: полифил уходит, а библиотека остаётся только ради старого кода.

Не нужна для формы и своих данных: хватит встроенной проверки и разбора. Платформа: встроенная проверка формы (constraint validation) — Widely с 11.06.2021. required, pattern, min и max пишутся прямо в разметке, а правило из той же статьи — браузерная проверка — про удобство, серверная — про доверие — не отменяет никакая библиотека.

Своя сборка — в этой же части. Правила, которых браузер знать не может, подключаются через setCustomValidity, а данные, восстановленные из хранилища, в проекте разбирались руками — проверкой каждого поля через typeof. В части III тот же разбор получит типы, а в статье «Данные извне — это unknown», в разделе «Когда данные не подошли», снова встанет выбор между своим разбором и библиотекой схем.

Стена — не сложность одной проверки, а их число. Когда полей десятки, а форма данных одна и та же в форме, в хранилище и на сервере, её хочется описать один раз — схемой — и получать из неё и проверку, и список того, что не сошлось. Это работа библиотеки схем. Для браузера на полке Valibot: каждая его функция — отдельный экспорт, и в сборку попадает только то, чем код пользуется. Для контракта, общего с сервером, — Zod. Обе реализуют Standard Schema — общий интерфейс, через который форма или сервер принимают схему любой из них; разбирается он на полке React и Next.

У Zod есть ловушка веса, и выглядит она как противоречие пройденному. В статье о статичности импортов форма импорта вес почти не меняла: import { debounce } from "lodash-es" и import * as _ с вызовом _.debounce() давали одинаковый бандл, а решало то, раскладывает ли библиотека код на отдельные экспорты. У Zod замер одной и той же схемы в трёх формах импорта расходится в разы — esbuild 0.28.2, zod 4.6.5, 14.09.2026:

Противоречия нет, есть устройство пакета. В zod 4.6.5 z — не функция, а один экспорт-объект со всей библиотекой внутри: файл index.js пакета делает import * as z from "./v4/classic/external.js" и отдаёт его наружу строкой export { z, z as default }. Именованный импорт этого объекта — тот самый «один огромный объект», про который статья об импортах говорила, что доказать ненужность остального трудно. esbuild и не доказывает: кладёт в сборку всё. А обращения через import * as z он разбирает по свойствам и оставляет использованное. Комментарий в том же index.js утверждает, что Rollup и webpack умеют выкидывать лишнее и из именованного z, — это мы не проверяли, поэтому говорим «в esbuild», а не «всегда». Вывод шире Zod: форма импорта решает, но как именно, зависит и от того, как библиотека экспортирует, и от того, чем собирают.

Вторая разница между библиотеками пригодится на полке React и Next: путь до поля с ошибкой они записывают по-разному. Обе схемы ниже отвечают через интерфейс Standard Schema — поле "~standard":

import * as z from 'zod';
import * as v from 'valibot';
const Task = z.object({ title: z.string().min(1, 'пустой заголовок') });
const TaskV = v.object({ title: v.pipe(v.string(), v.minLength(1, 'пустой заголовок')) });
for (const [name, schema] of [['zod', Task], ['valibot', TaskV]]) {
  const r = await schema['~standard'].validate({ title: '' });
  console.log(name, '→', JSON.stringify(r.issues.map((i) => ({ message: i.message, path: i.path.map((s) => (typeof s === 'object' ? `{key:${s.key}}` : s)) }))));
}

У zod путь — строка "title", у valibot — объект с полем key; для печати он свёрнут в {key:title}. Код, который принимает схему любой библиотеки, обязан понимать оба вида.

На полке обе: Valibot — для браузера, Zod — когда та же схема живёт и на сервере. У обеих в реестре по одному сопровождающему — это пометка о риске, а не отказ.

Пересмотреть, если выйдет zod 5 или Standard Schema 2.

Не нужна, если хватает structuredClone, Object.groupBy и Set. У библиотек утилит платформа за последние годы забрала больше всего. structuredClone — Widely с 14.09.2024. Object.groupBy и Promise.withResolvers — Widely с 05.09.2026, за девять дней до снимка. Методы Set вроде union и intersection — Newly с 11.06.2024, Widely станут 11.12.2026. Итераторные хелперы — Newly с 31.03.2025, Math.sumPrecise — Newly с 10.04.2026.

Своя сборка: глубокая копия, ради которой раньше тащили lodash, и Set без дублей. Чего в платформе нет — debounce и throttle, отложенного и прореженного вызова. Написать их можно и самому, но за первыми десятью строками идут отмена, вызов в начале серии, вызов в конце серии, досрочный вызов — у debounce из es-toolkit это методы cancel и flush и опция edges. Ради такого и держат маленькую библиотеку.

Снимок сравнивает две библиотеки на одном и том же импорте — debounce и groupBy. groupBy в замере ради честного сравнения: в новом коде его заменяет Object.groupBy.

Разница почти в 17 раз при одной и той же строке import { debounce, groupBy }, и дело здесь не в форме импорта, как у Zod, а в том, что внутри. groupBy из lodash принимает вместо функции ещё и имя свойства или объект-образец, и эта поддержка тянет за собой общий механизм сопоставления значений. Честная оговорка: lodash не мёртв — 4.18.1 вышла 01.04.2026, — он просто тяжелее. На полке es-toolkit; lodash-es — запас для проекта, где lodash уже есть.

Пересмотреть, если методы Set станут Widely, — по датам web-features это 11.12.2026: тогда пересечения и разности наборов пишутся без оговорки про старые браузеры.

Не нужна для одного-трёх простых графиков: polyline в SVG. Платформа: SVG и canvas, оба Widely давно. Своей сборки в учебнике нет: SVG мелькнул одной строкой — в разделе о createElement сказано, что для графики нужен createElementNS, — а графиков ни одна статья не строила. Поэтому своя сборка здесь.

Двенадцать месяцев выручки, линия и подписи оси. Ломаную линию в SVG рисует элемент polyline: в его атрибуте points через пробел записаны пары «x,y». Ось y в SVG смотрит вниз, поэтому чем больше выручка, тем меньше y. Метод getBBox() возвращает рамку, в которую уместилась нарисованная линия. Прогноз: какие числа выйдут в делениях оси?

const sales = [12, 18, 9, 22, 30, 27, 35, 31, 40, 38, 45, 52]; // выручка по месяцам
const W = 240;
const H = 80;
const max = Math.max(...sales);

const points = sales.map((value, i) => {
  const x = (i / (sales.length - 1)) * W;
  const y = H - (value / max) * H;
  return `${x.toFixed(1)},${y.toFixed(1)}`;
});

const NS = "http://www.w3.org/2000/svg";
const svg = document.createElementNS(NS, "svg");
svg.setAttribute("viewBox", `0 0 ${W} ${H}`);
svg.setAttribute("width", W);
svg.setAttribute("height", H);
const line = document.createElementNS(NS, "polyline");
line.setAttribute("points", points.join(" "));
line.setAttribute("fill", "none");
line.setAttribute("stroke", "currentColor");
svg.append(line);
document.querySelector("#chart").append(svg);

console.log("точек в линии:", line.points.numberOfItems);
const box = line.getBBox();
console.log("рамка линии:", Math.round(box.width), "×", Math.round(box.height));

// подписи оси: делим максимум на четыре части
const ticks = [0, 1, 2, 3, 4].map((k) => (max * k) / 4);
console.log("деления оси:", ticks.join(" · "));

Некруглые подписи оси на настоящий график никто не повесит: человек ждёт круглых делений, и это первая строка стены. Дальше подсказка с числом при наведении, доступность для программ чтения экрана, тысячи точек без тормозов, масштаб и легенда. Каждая строка — отдельная работа, и вместе они и есть библиотека графиков.

Снимок — три библиотеки для трёх размеров задачи: Chart.js рисует на canvas обычные графики, uPlot — большие временные ряды, ECharts — дашборды и заметно тяжелее.

Две оговорки, найденные при проверке. У Chart.js за последний год один выпуск — 4.5.1 от 13.10.2025, и 13.10.2026 исполнится 12 месяцев без новой версии. Коммиты в репозиторий при этом идут, последний — 14.09.2026. Вопрос 1 он пока проходит и стоит на полке с этим условием. У uPlot выпуска нет с 14.03.2025, и по датам вопрос 1 он уже не проходит. Но репозиторий жив — за год больше 30 коммитов, последний 14.09.2026, — поэтому uPlot стоит на полке только с пометкой: законченная библиотека, проверено по репозиторию.

Пересмотреть, если к 14.10.2026 у Chart.js не выйдет новая версия: после года без выпуска его, как uPlot, проверяют по репозиторию.

Не нужна для наведения, появления и смены состояний: CSS и element.animate(). Платформа: Web Animations API — Widely с 16.03.2023; View Transitions в пределах одной страницы — Newly с 14.10.2025; анимации, привязанные к прокрутке, не Baseline — в Firefox их нет.

Своя сборка — в прологе, и там же названа стена. Переход кончается там, где движением нужно управлять из JavaScript, а ключевые кадры — там, где путь решается по ходу движения: пружина, которая помнит скорость жеста, исчезновение удалённого элемента, перестройка раскладки.

За этой стеной на полке Motion, и у него две весовые категории. motion/mini строит анимацию на том же element.animate() и весит как небольшой модуль; полный animate из motion тяжелее примерно в шесть раз. Исчезновение и раскладка в React у Motion свои, и их разбирает статья «Анимация в React» в части IV.

GSAP — запас, и главное о нём не вес, а лицензия. В поле license реестра у него не MIT, а ссылка на стандартную лицензию GSAP. По её тексту (сверен 14.09.2026, редакция страницы от 30.05.2025) порога выручки нет и коммерческое использование бесплатно, а запрещено встраивать GSAP в no-code конструкторы визуальных анимаций, которые конкурируют с Webflow. Сайта или приложения это условие обычно не касается, но прочитать его до установки — ровно тот случай, ради которого поле license и открывают.

Пересмотреть, если анимации по прокрутке появятся в Firefox.

Не нужна для сотен строк: table и методы массивов. Платформа: <table>, filter и toSorted, последний — Widely с 04.01.2026. Своя сборка — в проекте этой части: функция render собирает разметку из состояния через map и join, а щелчки ловит один обработчик на контейнере. Сортировка по столбцу — ещё один toSorted перед тем же render.

Стена здесь названа прямо — тысячи строк. Когда строк тысячи, дорогим становится сам DOM: узлов слишком много, чтобы пересобирать их все на каждую сортировку. Выход — виртуализация: рисовать только строки, которые видны, и подставлять остальные при прокрутке. Рядом копятся сортировка по нескольким столбцам, фильтры по каждому и группировка.

TanStack Table даёт модель строк без разметки — сортировку, фильтры, группировку, страницы, — а рисуете вы. Виртуализации в нём нет: среди 109 экспортов @tanstack/table-core 9.2.4 нет ни одного про virtual, её добавляют отдельно. И ловушка свежего мажора: у версии 9, вышедшей 04.08.2026, другой API. createTable и getCoreRowModel больше не экспортируются, вместо них constructTable, coreFeatures и функции вида createSortedRowModel, так что уроки и ответы по версии 8 с ней не совпадут.

AG Grid Community — запас, если нужен готовый компонент таблицы, а не модель: пакет под MIT, но часть функций продаётся в платной Enterprise.

Пересмотреть, если выйдет TanStack Table 10 или AG Grid сменит лицензию Community.

Не нужна для текста: textContent. Платформа: textContent работает всегда. Sanitizer API — метод setHTML, который вставляет HTML, вычищая опасное, — не Baseline: он есть в Chrome с 146 и Firefox с 148, а в Safari его нет. Trusted Types — режим, в котором innerHTML принимает не любую строку, а только значение, созданное вашей политикой очистки, — Newly с 24.02.2026.

Своя сборка — статья о чужих строках: onerror из innerHTML выполняется, а самодельные фильтры обходят лучше, чем пишут. Проверим это на самом частом самодельном фильтре — регулярке, которая вырезает <script>. Прогноз: выполнится ли чужой код?

// самодельный «санитайзер»: вырезает теги script вместе с содержимым
function stripScripts(html) {
  return html.replace(/<script[\s\S]*?<\/script>/gi, "");
}

const comment =
  "<p>Спасибо за статью!</p>" +
  '<script>window.hacked = "через script"</script>' +
  '<img src="x" onerror="window.hacked = \'через onerror\'">';

const clean = stripScripts(comment);
console.log("script после фильтра:", clean.includes("<script"));

const out = document.querySelector("#out");
out.innerHTML = clean;
out.querySelector("img").addEventListener("error", () => {
  console.log("hacked:", window.hacked);
});

Атрибутов-обработчиков в HTML десятки, а способов записать тег так, чтобы регулярка его не узнала, ещё больше. Это стена: разбирать HTML должен разборщик HTML, а не регулярное выражение.

Там, где метод есть, разбор берёт на себя браузер. Та же строка через setHTML. Прогноз: что останется от комментария?

const out = document.querySelector("#out");
const comment = '<p>Спасибо!</p><script>window.hacked = 1</script><img src="x" onerror="window.hacked = 2">';

if ("setHTML" in out) {
  out.setHTML(comment);
  console.log(out.innerHTML);
} else {
  console.log("setHTML нет — чужой HTML чистит библиотека");
}

Вывод снят в Chrome 152, Firefox 155 дал то же самое; в Safari метода нет, и пример напечатает запасную строку.

Пока setHTML есть не везде, чужой HTML чистит DOMPurify. Тот же комментарий через него — страница с модулем, собранным esbuild, вывод из консоли вкладки:

import DOMPurify from 'dompurify';

const comment = '<p>Спасибо за статью!</p><script>window.hacked = "через script"</script><img src="x" onerror="window.hacked = \'через onerror\'">';
console.log(DOMPurify.version);
console.log(DOMPurify.sanitize(comment));
console.log(DOMPurify.sanitize('<a href="javascript:alert(1)">ссылка</a><b onclick="x()">жирный</b>'));

const box = document.createElement('div');
box.innerHTML = DOMPurify.sanitize(comment);
document.body.append(box);
setTimeout(() => console.log('hacked после вставки очищенного:', window.hacked), 300);

DOMPurify по умолчанию мягче: картинку оставил, а onerror выбросил, у ссылки снял javascript:, у <b> — onclick. Вставленный результат чужой код не запустил.

Пересмотреть, если Sanitizer API появится в Safari: DOMPurify станет запасным путём.

Не нужна для открытия, фокуса и верхнего слоя: popover и dialog. Платформа: атрибут popover — Newly с 27.01.2025; <dialog> — Widely с 14.09.2024; команды кнопок command и commandfor — Newly с 12.12.2025. Что из этого пролог советовал писать, а что пока только знать, — в разделе «Что пока требует скрипта или слишком свежее». CSS anchor positioning, которая ставит подсказку прямо у кнопки, не Baseline: по web-features 3.38.0 целиком её пока не поддерживает ни один браузер, и пролог предупреждал не рассчитывать на неё.

Своя сборка — подсказка рядом с элементом из этой части: координаты из getBoundingClientRect, у нижнего края окна подсказка переворачивается наверх, у правого — сдвигается влево. Руками, но работает.

Стена — словами, без примера: рамка примера слишком мала, чтобы честно показать переворот. Своя подсказка знает только края окна. Поставьте кнопку внутрь списка с собственной прокруткой, а список — внутрь панели, которая тоже прокручивается, и подсказку придётся пересчитывать при прокрутке каждого из них и при изменении их размеров. В @floating-ui/dom 1.8.0 это отдельные экспорты: computePosition с flip и shift считает положение, getOverflowAncestors находит всех прокручиваемых предков, а autoUpdate пересчитывает положение, когда они прокручиваются или меняют размер.

Пересмотреть, если anchor positioning станет Baseline.

Не нужна для пары строк: хватит localStorage. Платформа: IndexedDB — Widely с 20.03.2024; navigator.storage с persist() и estimate() — Widely с 18.03.2026.

Своя сборка — хранилища, которые уже встречались. У localStorage около 5 МБ и синхронная запись, а таблица мест хранения из проекта части I отдаёт много данных, файлы и офлайн IndexedDB. И оговорка из главы про офлайн, которая касается любой обёртки: Safari удаляет данные сайта, в том числе IndexedDB, после семи дней пользования браузером без единого нажатия или касания на страницах сайта.

Стена — сам API. IndexedDB появилась в браузерах раньше промисов, и открытие базы, каждое чтение и каждая запись в ней — объект-запрос с событиями success и error, а схема базы меняется в обработчике upgradeneeded. Код на таких запросах быстро превращается в лестницу обработчиков. idb заворачивает их в промисы: await db.get("tasks", 1) вместо запроса с двумя обработчиками. Запускаемого примера здесь нет: у рамки примера уникальное происхождение, и indexedDB.open в ней бросает SecurityError.

С idb полка делает исключение. По датам вопрос 1 он не проходит: выпуска нет с 07.05.2025, коммитов за год нет. Законченную библиотеку от брошенной по датам не отличить, это решает человек — по issues, и ответ там честный, а не красивый: 57 открытых обсуждений, предложенные исправления ждут месяцами и годами. Для обёртки в 1,3 КБ над стабильным API это приемлемо: ломаться в ней почти нечему, а её код читается за вечер. Для большой библиотеки такой ответ был бы отказом.

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

Эти пакеты ещё встречаются в старых проектах, курсах и ответах на форумах. У каждого — что случилось, номер вопроса из «Живой ли пакет», на котором он отсеялся, и что брать вместо. Вопросы, которые понадобятся здесь и в следующем разделе: 0 — умеет ли это платформа, 1 — жив ли пакет, 2 — растёт ли его доля в нише, 3 — цена, 4 — навязывает ли пакет устройство проекта.

request здесь не стоит: это HTTP-клиент для Node, в браузере он не жил. Его пометка deprecated разобрана в статье «Живой ли пакет».

Сошедший пакет не выкорчёвывают завтра. Но новый код на нём не пишут, а при следующей большой правке меняют.

Пакеты ниже живы: пометок deprecated нет, выпуски свежие. Исключение — Luxon: выпуск старше года, и живость решает дата, см. ниже. Отказ у каждого — не оценка качества, а факт, который можно проверить: у четырёх это вопрос статьи «Живой ли пакет», у Luxon — место на полке, которое уже занято.

Строки ApexCharts и GSAP с полки «Анимация» стоит сравнить. Обе лицензии не MIT, но условия разные: порог выручки ApexCharts касается работодателя читателя, а у GSAP порога нет вовсе — его условие касается конкурирующих no-code конструкторов.

Luxon — самая спорная строка, поэтому подробно. По живости он на грани: на дату снимка выпуску 3.7.2 год и девять дней — функция health() из статьи «Живой ли пакет» считает полные месяцы, насчитывает ровно 12 и с порогом «больше 12 месяцев» пропускает; с 05.10.2026 месяцев станет 13, и тот же порог его завернёт: выпуска старше года у пакета уже нет. Репозиторий жив (23 коммита за год), загрузки выросли ×1,70 — но первый вопрос с этой даты решается по дате, как у uPlot. Причина отказа — роль. Luxon берут ради неизменяемых дат с часовыми поясами, а это место на полке занимает Temporal с temporal-polyfill: полифил удаляется одной строкой, когда Temporal будет везде, а объекты DateTime из Luxon остались бы в каждом вызове. Функции над Date для нынешнего кода — date-fns, путь со старого moment — dayjs.

Отказ по цене или по устройству проекта не запрещает пакет в чужом проекте. Он говорит, чем придётся платить позже, и знать это нужно до установки.