patternfly-elements icon indicating copy to clipboard operation
patternfly-elements copied to clipboard

[tools] Dynamic imports to load web component

Open starryeyez024 opened this issue 6 years ago • 2 comments

Requested results:

  • Baseline testing (lighthouse)
  • Blog post of recommended approaches of how to load WCs on your site (SPA vs. CMS, etc)

Resources:

  • btopro video on dynamic imports
  • dimport, is an ESModule polyfill allowing you to run import, export, and import() in any browser – even IE.
  • It offers 3 modes, with varying backwards reach. They vary in size from 675B to 1.14 kB

GitHub: https://github.com/lukeed/dimport Demo: https://dimport.now.sh

starryeyez024 avatar May 14 '19 04:05 starryeyez024

POC by @kylebuch8 https://github.com/kylebuch8/optimized-loading

Notes: https://docs.google.com/document/d/1ZsOr-x72901ahwCRGyEIxMdqLlAVmQX6RaSsXz2PQCA/edit#heading=h.njozdg7grea0

starryeyez024 avatar Oct 08 '20 15:10 starryeyez024

Proof of concept last month validated this approach as a good fallback for CMS experiences where authors can add components but don't necessarily know how/where to load assets from. What can PFE do to make this easier to implement?

  • [ ] Documentation on how to use autoloaders OR
  • [ ] Possibly our own variant of the autoloader (cc @kylebuch8)
  • [ ] An automatically generated registry pointing to unpkg listing all components available (good for demo/upstream use)

castastrophe avatar Apr 27 '21 16:04 castastrophe