Split Icon loading into separate bundle or npm-package

• move everything in src/lib/components/atoms/iIcons/ to ui-icons or ui-picograms

For ui-atoms#12, we could either

• Lazy load icons in separate bundles or
• Move Icons & SVG-handling into a separate npm-package

Looking at our pipeline the following is apparent:

Preview built (51 s)
WARN asset size limit: The following asset(s) exceed the recommended size limit (244 KiB).
WARN This can impact web performance.
WARN Assets: 
WARN   main.7743c5f197798de6b7e3.bundle.js (330 KiB)
WARN   vendors~main.7743c5f197798de6b7e3.bundle.js (1.12 MiB)
WARN entrypoint size limit: The following entrypoint(s) combined asset size exceeds the recommended limit (244 KiB). This can impact web performance.
WARN Entrypoints:
WARN   main (1.45 MiB)
WARN       runtime~main.7743c5f197798de6b7e3.bundle.js
WARN       vendors~main.7743c5f197798de6b7e3.bundle.js
WARN       main.7743c5f197798de6b7e3.bundle.js
WARN 
WARN webpack performance recommendations: 
WARN You can limit the size of your bundles by using import() or require.ensure to lazy load some parts of your application.
WARN For more info visit https://webpack.js.org/guides/code-splitting/
info => Output directory: /builds/linguala/ui-atoms/storybook-static

See https://webpack.js.org/guides/code-splitting/

To be clear, the warning comes from building storybook-static. The solution could be applied with rollup.

The benefit is faster loading and smaller total bundle size for a visiting user. Making sure only the icons load, which will be displayed, can save a few seconds on some network conditions as asset contain a lot of data to be parsed.