This article contains additional information on options for how to build deck.gl.
deck.gl and luma.gl provide a lot of functionality and the amount of code these libraries contain will of course impact the size of your application bundle and your startup load time.
When installed from npm, deck.gl and related libraries come with three separate
dist sub folders.
|All code is transpiled into ES5 and exports/imports are transpiled into |
|Same as |
|This distribution uses |
You will have to check the documentation of your particular bundler to see what configuration options are available:
esnextdistribution by specifying a
modulemain field over
mainif it is available.
For other bundlers, please refer to the respective documentation.
deck.gl was designed from the start to leverage tree-shaking. This technique has been talked about for quite some time but has been slow in actually providing the expected benefits. With the combination of webpack 4 and babel 7 we are finally starting to see significant results, so you may want to experiment with upgrading your bundler if you are not getting results.
Note that tree-shaking still has limitations:
So, what bundle size impact should you expect? When do you know if you have set up your bundler optimally. To help answer these questions, we provide some numbers you can compare against. deck.gl has scripts that measure the size of a minified bundle after each build, which allows us to provide comparison numbers between releases.
|Dist||6.0 Bundle (Compressed)||5.2 Bundle (Compr.)||5.1 Bundle (Compr.)||Comments|
|ES6||530 KB (142 KB)||527 KB (141 KB)||N/A||Minimally transpiled, almost "pure" ES6|
|ESM||633 KB (153 KB)||715 KB (159 KB)||708 KB (169 KB)||Transpiled, tree-shaking enabled|
|ES5||695 KB (167 KB)||748 KB (166 KB)||754 KB (176 KB)||Transpiled to ES5, no tree-shaking|
This is not the final word on deck.gl bundle size. More work is being done to reduce the size of deck.gl and we are confident that even as future releases will have more functionality, we will be able to keep the library code from growing and, more importantly, make deck.gl even more "tree shakeable", with the intention that apps should only "pay for what they use".
gzip -9. Consider using slower
brotlicompression for static assets, it typically provides an additional 20% reduction.