Expo react native web build optimization best practices

Viewed 317

I'm looking for best practices to optimize an Expo react native app when building web. I have everytime I run expo build:web this warning showing up:

Compiled with warnings.

asset size limit: The following asset(s) exceed the recommended size limit (586 KiB).
This can impact web performance.
Assets: 
  static/js/2.e9374ad4.chunk.js (2.2 MiB)

entrypoint size limit: The following entrypoint(s) combined asset size exceeds the recommended limit (586 KiB). This can impact web performance.
Entrypoints:
  app (2.2 MiB)
      static/js/runtime~app.2e9f1821.js
      static/js/2.e9374ad4.chunk.js
      static/js/app.1b833e73.chunk.js

webpack performance recommendations: 
You can limit the size of your bundles by using import() or require.ensure to lazy load some parts of your application.
For more info visit https://webpack.js.org/guides/code-splitting/

What can I do to optimize it?

My webpack.config.js file looks like this:

const createExpoWebpackConfigAsync = require('@expo/webpack-config');

module.exports = async function (env, argv) {
  const config = await createExpoWebpackConfigAsync(
    { 
      ...env,
      offline: true,
      performance: {
        maxEntrypointSize: 512000,
        maxAssetSize: 512000
      }
    }, 
    argv);
  return config;
};
0 Answers
Related