Idenfity if a package has a sideEffects: false field in package.json

[TheLarkInn]

Type

Feature Request

With webpack v4 around the corner, it would be awesome to denote to users searching for packages if their package (in addition to using the "module" field), also is "sideEffect free". We have package authors (see lodash-es) annotate this using a new field called "sideEffects: false". If this is set, webpack can perform even deeper optimizations to a library using ESM. (Also builds are faster because we skip evaluation of those unused exports).

[TheLarkInn]

Potentially could add the annotation here:

bundlephobia/index.js

Lines 316 to 324 in d8202a9

	const body = {
	error: {
	code: 'MissingDependencyError',
	message: `This package (or this version) uses ${missingModules}, ` +
	`but does not specify ${missingModules.length > 1 ? 'them' :
	'it' }<br /> either as a dependency or a peer dependency`,
	details: err,
	},
	}

[pastelsky]

Hi @TheLarkInn. Thanks for writing in. What kind of improvements in size does one generally see when using a sideEffects:true package versus otherwise? Also, which webpack versions support this at the moment?

[TheLarkInn]

Hi there! The sizes can be incredibly significant. With lodash-es, a single import with sideEffects: false now in their package.json takes a 60kb hit to 1-2kb. However not every library will exhibit this behavior. Also it will be as of webpack 4 and on.

[pastelsky]

With lodash-es, a single import with sideEffects: false now in their package.json takes a 60kb hit to 1-2kb

Does the difference hold in addition to the existing way of treeshaking using jsnext:main / module fields? i.e.

[pastelsky]

I've added supports for indexing the sideEffects field for all new package searches. Will add support for surfacing this in the UI when webpack@4 becomes stable.

[machineloop]

I believe Wepback@4 has been released, is this available?

[pastelsky]

This is available in the quick info bar just below the search input. 🎊