diff --git a/proposals/0012-enhanced-img.md b/proposals/0012-enhanced-img.md new file mode 100644 index 0000000..2a28390 --- /dev/null +++ b/proposals/0012-enhanced-img.md @@ -0,0 +1,51 @@ +- Start Date: 2018-01-22 +- RFC PR: +- Elix Issues: + + +# Summary + +Build an enhanced version of the `` tag, the `` and provide features that mainly improve performance. +The usage will be compatible to the standard HTML element ``, so it can be a drop-in replacement. +Just use `` instead of ``. + + +# Motivation + +The use of `` might have a serious impact on user experience, we want to improve that where possible. +We want the `` to improve web page speed and optimize network usage where possible, +without sacrificing but improving the user experience. + +It is not a goal to provide enhanced visual features, like text overlay or alike. ???? Opinions requested !!!! + +# Use cases + +1. Gallery website +2. Banner carousel +3. Mix of content, e.g. news articles, etc. +4. Side-by-side comparison of native element, e.g. logo + + +# Detailed design + +Features +1. Lazy-load - Don't download/render anything below the fold +2. Pre-cache - Pre-cache images below the fold ready for when the user needs them (Look at different ways to do this, Fetch, Cache, native async/decode attribute) +3. Loader - none by default, configurable by attribute and a little CSS (with default styles provided?). +4. All attributes of native img - see: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img +5. Various formats - provide best possible format for given browser? E.g. WebP if Chrome detected, with a fallback, perhaps reuse srcset attribute? +6. Downloadable - via attribute and a little CSS to show Download icon (with default styles provided?). We often do right click and hit download. +7. Licence - attribute with value to set given licence. Perhaps some CSS to show it (on / off). Attribute itself is just informative. +???? + + +# Drawbacks + +???? + +# Alternatives + +If there is no interestion observer API available just fallback to a native element. + + +# Unresolved questions