Hide content until loaded

[bennypowers]

Following on https://github.com/justinfagnani/html-include-element/pull/7#discussion_r379845320, we'd like some atts to control loading behaviour.

Strawman

Default loading behaviour should defer the load event until all loaded resources are finished. It should also hide the content with display: none; until the resources are loaded.

Applying the fouc attribute disables the hide-until-load-event behaviour, showing content and allowing a FOUC to occur

Applying the eager attribute disables the defer-load-event behaviour, firing the load event as soon as the partial at src is fetched and parsed as innerHTML

Questions

• Should we defer load for only link[rel="stylesheet"], or for img and iframe as well?
• Bikeshedding attr names: proposed names are very bespoke, can we uses something more appropriate by borrowing from existing APIs? (async, defer, etc.)
  • OTOH, we'd perhaps like these behaviours to be opt-out rather than opt-in, so no-async no-defer?