Max Home IndustryЕсть новая версия Next.js, ориентированная на создание статических сайтов. Next.js — это набор инструментов с открытым исходным кодом для универсальных, отрисовываемых на сервере (или статически предварительно отрисованных) приложений React.js.
Next.js описывается как интуитивно понятная система маршрутизации на основе страниц с поддержкой динамических маршрутов. Он автоматически статически оптимизирует страницы, когда это возможно, и выполняет рендеринг страниц на стороне сервера с требованиями к блокирующим данным. Он имеет маршрутизацию на стороне клиента с оптимизированной предварительной выборкой страниц, встроенную поддержку CSS и поддержку любой библиотеки CSS-in-JS. Маршруты API используются для создания вашего API с бессерверными функциями, с тем же простым маршрутизатором, который используется для страницы, и его можно настраивать с помощью плагинов сообщества и ваших собственных конфигураций Babel и Webpack.
Первым изменением в новом выпуске является добавление новых методов выборки данных, которые добавляют встроенную оптимизированную статическую генерацию. Команда Next.js утверждает, что это первая гибридная структура, позволяющая выбирать между статической генерацией (SSG) или рендерингом на стороне сервера (SSR) на постраничной основе. Next.js 9.0 представил концепцию автоматической статической оптимизации, означающую, что, когда страница не имеет требований к блокировке выборки данных, она будет автоматически отображаться в HTML во время сборки. Однако даже с блокировкой выборки данных вы можете захотеть отобразить страницу в статический HTML во время сборки.
В новом выпуске добавлены два новых метода выборки данных: getStaticProps и getServerSideProps, а также включен способ предоставления параметров для статической генерации статических страниц для динамических маршрутов: getStaticPaths. Новые методы обеспечивают четкое различие между SSG и SSR. В новом выпуске также добавлен режим предварительного просмотра, который может обходить статически сгенерированные страницы для отображения черновиков из CMS.
Теперь есть встроенная поддержка Sass для глобальных таблиц стилей, и приложения теперь могут напрямую импортировать файлы .scss как глобальные таблицы стилей. Также добавлена поддержка встроенного модуля Sass CSS для стилей на уровне компонентов. При этом используется соглашение .module.scss, что означает, что CSS с локальной областью видимости можно импортировать и использовать в любом месте вашего приложения. Размер среды выполнения для всех приложений Next.js также был уменьшен за счет оптимизации.