Written with AI assistance from the source video. The video is the authority.
Log in to leave a comment
No posts yet
С официальным релизом Solid 2.0 старый пакет метафреймворка solid-start полностью ушел в прошлое. Фронтенд-командам, управляющим крупномасштабными коммерческими приложениями, необходимо незамедлительно удалить структуру зависимостей. Полностью удалите solid-start и платформенные адаптеры из проекта, а также измените серверную точку входа так, чтобы она экспортировала единственную функцию контракта handleRequest(request: Request) на базе веб-стандарта Fetch API. Старый хук onMount был объединен с хуком onSettled, который возвращает функцию очистки в момент полного разрешения дерева асинхронной реактивности.
Для безопасного выполнения миграции необходимо изолировать зависимости пакета и вручную заменить точку входа. Во-первых, удалите solid-start из package.json и обновите версию @solidjs/vite-plugin до 2.0.0-rc.1 или выше. Во-вторых, создайте файл vite.config.ts и настройте параметры plugins: [solid({ start: true, ssr: true, router: { type: 'filesystem', dir: 'src/routes' } })]. В-третьих, измените обработчик рендеринга в файле серверной точки входа entry-server.tsx на интерфейс веб-стандарта handleRequest(request: Request). Этот процесс позволит снизить процент сбоев при начальной сборке более чем на 80 процентов и решить проблемы совместимости цепочки инструментов.
Реактивный движок Solid 2.0 возвел асинхронные операции Promise в ранг сигнальных значений первого класса в реактивном графе, а также полностью удалил старый примитив выборки данных createResource. Разработчики могут объявлять обычный createMemo внутри компонентов и напрямую возвращать асинхронную функцию для работы с разрешенными значениями без отдельной логики защитной ручной обработки. Чтобы предотвратить появление сдвигов макета (CLS), когда новые асинхронные запросы инициируются изменениями родительских props, граница <Loading> сохраняет предыдущее состояние пользовательского интерфейса и регулирует прозрачность с помощью функции isPending(user).
Для рефакторинга логики асинхронной выборки необходимо объединить обычную структуру мемоизации и границы. Во-первых, напишите обычный createMemo(() => fetchUser(props.userId)), содержащий логику выборки данных. Во-вторых, разместите границу <Errored> в самом верху шаблона JSX для перехвата сетевых ошибок 5xx или отклоненных Promise и предоставления кнопки локального восстановления. В-третьих, оберните внутренний контент в <Loading fallback=""{<ProfileSkeleton"/>}"> и примените условную стилизацию class={{ 'opacity-50': isPending(user) }}. Данная процедура гарантирует целостность данных в условиях сетевых задержек и предотвращает ухудшение пользовательского опыта.
Цепочка инструментов Solid 2.0 исключает старые транспиляторы на базе JavaScript и Babel, интегрируя компиляторные движки Oxc и Rolldown на базе Rust, что обеспечивает увеличение скорости компиляции от 20 до 355 раз. Однако включение устаревшего плагина на базе среды выполнения Node.js V8 посередине конвейера сборки приводит к появлению накладных расходов на сериализацию NAPI, нивелирующих преимущества производительности компилятора Rust и вызывающих ошибки синтаксического анализа. Поэтому выполнение скрипта автоматизации для очистки несовместимых устаревших плагинов является обязательным.
Для устранения конфликтов устаревших плагинов необходимо пройти процедуру проверки и очистки. Во-первых, создайте файл scripts/check-legacy-plugins.js в корне проекта и определите список конфликтующих плагинов, таких как babel-plugin-transform-async-to-generator и @babel/plugin-proposal-decorators. Во-вторых, используя модуль файловой системы, динамически прочитайте содержимое vite.config.ts и выполните диагностическую функцию для проверки наличия строк несовместимых плагинов. В-третьих, выполните команду node scripts/check-legacy-plugins.js в терминале для очистки обнаруженных проблем и сотрите кэш в среде локальной разработки с помощью команды rm -rf node_modules/.vite .oxc_cache. Этот процесс позволяет предотвратить ошибки начальной сборки при миграции и восстановить скорость HMR сервера разработки.
Ядро Solid 2.0 поставляется со встроенными экшенами и примитивами оптимистичных сторов, что упрощает обработку асинхронных мутаций состояния. В отличие от традиционных парадигм сторов, оптимистичные обновления работают как механизм реактивного наложения, который наслаивает временные изменения в виде иерархии поверх подтвержденных данных фонового стора. Управление последовательностями транзакций внутри action или сериализация запросов позволяет полностью предотвратить состояния гонки, возникающие при подписке нескольких компонентов на один и тот же стор.
Для создания оптимистичных транзакций и промежуточного ПО для ручного отката необходимо изменить структуру управления данными. Во-первых, вызовите функцию snapshot(store) для захвата данных в определенный момент времени непосредственно перед асинхронным запросом. Во-вторых, используйте обратный вызов setStore для немедленной записи оптимистичного состояния в объект draft с целью его превентивного отображения в пользовательском интерфейсе. В-третьих, если во время выполнения асинхронной серверной функции происходит исключение, выполните инструкцию setStore(() => previousSnapshot) внутри блока catch для принудительного восстановления предыдущего состояния. Это позволяет добиться стабильного управления состоянием без потери данных формы даже в условиях задержки сетевого ответа или тайм-аута.
В средах сборки Solid 2.0 и Vite 8 необходимо эффективно управлять артефактами Rust и кэшем сборки компилятора Oxc для сокращения времени сборки CI/CD и снижения затрат на обслуживание серверов. Чтобы предотвратить сбои сборки в среде CI из-за ошибок нехватки памяти во время параллельной обработки данных компилятором Oxc, необходимо явно указать лимит кучи (heap memory) и количество рабочих потоков Rayon в виде переменных окружения. Кроме того, в среде выполнения SSR-сервера необходимо отслеживать корректность освобождения контекста дерева асинхронной реактивности, выделенного для каждого HTTP-запроса.
Для применения оптимизации конвейера и мониторинга памяти необходимо изменить файлы конфигурации. Во-первых, настройте действия кэширования (cache actions), включающие пути path: ~/.cargo/registry, path: .oxc_cache, path: node_modules/.vite, внутри YAML-файла рабочего процесса GitHub Actions. Во-вторых, объявите NODE_OPTIONS="--max-old-space-size=8192", RAYON_NUM_THREADS="4", UV_THREADPOOL_SIZE="8" в переменных окружения выполнения команды сборки, чтобы расширить память кучи до 8 ГБ и устранить узкие места потоков. В-третьих, напишите функцию-обертку мониторинга на базе process.memoryUsage().heapUsed в точке входа сервера для вывода лога предупреждения в случае, если прирост памяти превышает 10 МБ. После завершения этой процедуры вы сможете сократить время сборки в продакшн-среде и стабильно предотвратить утечки памяти во время выполнения.
