remix-seo

remix-seo copied to clipboard

Fixes https://github.com/balavishnuvj/remix-seo/pull/9.

Depend upon the full lodash package but only import the modules for the functions that we use. This is the recommended way to use lodash to produce the smallest possible bundles for serverless deployment.

From the Lodash documentation:

Lodash methods are available in standalone per method packages like lodash.mapvalues, lodash.pickby, etc. These packages contain only the code the method depends on.

However, use of these packages is discouraged and they will be removed in v5.

Although they may seem more lightweight, they will usually increase the size of node_modules and webpack/rollup bundles in a project that transitively depends on multiple per method packages and/or the main lodash package. Whereas many methods in the main lodash package share code, the per method packages internally bundle copies of any code they depend on.

For example, throttle uses debounce internally. In a project using both methods from the main lodash package, throttle will import the same debounce module as any code that imports debounce directly, so only one copy of debounce will wind up in a webpack bundle.

On the other hand, if a project imports throttle from lodash.throttle, the extra copy of the debounce code internally bundled into lodash.throttle will wind up in the webpack bundle, in addition to debounce from the main lodash package or lodash.debounce.