https://github.com/lourd/webpack-rrv4-code-splitting
An example for creating a lazily loaded React web app; code-splitting using Webpack 2 and React Router v4
https://github.com/lourd/webpack-rrv4-code-splitting
code-splitting lazy-loading react react-router webpack
Last synced: 11 months ago
JSON representation
An example for creating a lazily loaded React web app; code-splitting using Webpack 2 and React Router v4
- Host: GitHub
- URL: https://github.com/lourd/webpack-rrv4-code-splitting
- Owner: lourd
- Created: 2016-10-11T23:11:40.000Z (over 9 years ago)
- Default Branch: master
- Last Pushed: 2016-12-21T19:58:22.000Z (about 9 years ago)
- Last Synced: 2025-01-29T12:47:02.499Z (about 1 year ago)
- Topics: code-splitting, lazy-loading, react, react-router, webpack
- Language: JavaScript
- Homepage: http://lourd.github.io/webpack-rrv4-code-splitting
- Size: 244 KB
- Stars: 3
- Watchers: 3
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# What is this 🤔
A super simple web app demonstrating how to use the [React Router v4](https://react-router.now.sh/) and Webpack v2 APIs together to make a dynamically growing React app. It shows 5 whole words; it's the most amazing thing you've ever seen! 🙄
The meat of it is in `App.js` and `asyncComponent.js`; there's some comments in the code explaining what's happening. See it in action at [lourd.github.io/webpack-rrv4-code-splitting](https://lourd.github.io/webpack-rrv4-code-splitting). Open the Network section of your dev tools to get a better sense of what's happening.
I was motivated to make this after reading [part 2](https://medium.com/@addyosmani/progressive-web-apps-with-react-js-part-2-page-load-performance-33b932d97cf2#.tqpiex5fo) of Addy Osmani's series on Progressive Web Apps.