redfin / react-server

:rocket: Blazing fast page load and seamless navigation.
https://react-server.io/
Apache License 2.0
3.89k stars 184 forks source link

Support ignoring given route when building client bundle files #896

Open mocheng opened 7 years ago

mocheng commented 7 years ago

For the time being, react-server-cli builds client bundle file for each route, even for route with JsonResposneMiddleware that is actually not a web page.

Besides the waste of building bundle js that is never used, this process introduce a severe problem to webpack CommonsChunkPlugin. In react-server-cli, the CommonsChunkPlugin is created without minChunks option. As a result, it only extract modules that is referenced by all chunks.

Suppose there are some common components that are shared in all web pages. The components code should be extract to common.bundle.js. However, when I add one API route that just returns JSON content, without any reference to those common components. CommonsChunkPlugin would takes those common components not so common and make each web page bundle file have their own copies. This makes web page bundle file bloated! This is real waste.

Even though we can tweak minChunks by webpackConifg in file .reactserverrc, it would be more convenient to config it in routes.json.

Suggest to have noClientJs config value in routes.json. For example, in below config, Foo route is just API. With noClientJs: true, there is not entry for this route is passed to webpack.

{
  middleware: [],
  routes: {
    Home: {
      path: "/",
      method: "get",
      page: "./pages/Home"
    },
    Foo: {
      path: "/api/foo",
      method: "get",
      noClientJs: true,
      page: "./apis/Foo"
    }
  }
mocheng commented 7 years ago

One more interesting side effect: If not all UI common modules go into common.js, so are css modules. As a result, on page navigation, page specific CSS files are switched, which makes page flickering.