React Loadable: Code Splitting with Server Side Rendering

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

Разделить один бандл на несколько помогают такие инструменты, как Browserify и webpack. Но как только требуется также организовать рендеринг на сервере и имплементировать универсальную загрузку данных для нашего приложения, решать эту проблему становится сложнее. Кроме того, нам нужно найти места в нашем приложении, где мы будем разбивать его на другие бандлы и загружать их асинхронно, а также подумать, как нам связать сервер и клиент.

Если открыть в документации React Router 4 раздел «Code-splitting + server rendering», то можно увидеть: «We’ve tried and failed a couple of times».

В докладе будет показано, как можно решить эту проблему с помощью простой библиотеки React Loadable. Для этого доклада вам пригодятся знания React, Babel (ES6), Node, webpack 2 и Redux.

Язык доклада: RU

Скачать презентацию.

Георгий Буханов

Георгий Буханов

Работает более четырёх лет на позиции Senior Frontend Developer. Специализируется на создании сложных одностраничных приложений (SPA) с использованием таких технологий, как Node.js, React, Redux, Redux Saga, и других современных решений: webpack 2, Babel, React Router, Immutable.js, PostCSS, ESLint, и т.д. Последние два года работал в финском стартапе Oppex, поучаствовав в создании приложения на React c использованием всех вышеописанных технологий. Недавно перешёл в Toughbyte, но уже как Tech Lead с фокусом на фронтенд. Toughbyte помогает другим компаниям и стартапам выстроить их архитектуру, подобрать соответствующий стек технологий и многое другое. Помимо этого, обладает богатым опытом в разработке desktop-приложений, нативных мобильных приложений, а также в серверной разработке.