Skip to content
This repository has been archived by the owner on Oct 20, 2023. It is now read-only.

Add ability to preload images #3

Open
saltymouse opened this issue Jul 8, 2019 · 0 comments
Open

Add ability to preload images #3

saltymouse opened this issue Jul 8, 2019 · 0 comments
Labels
enhancement New feature or request question Further information is requested

Comments

@saltymouse
Copy link
Contributor

Continuing discussion from #2

Currently, the image will load only after the the Poppy element is inserted into the DOM (to show the users), leaving the image blank while loading. Possible solutions for preloading include:

  1. Inserting the Poppy element into the DOM upon each new Poppy() call, but hidden from view via CSS. The browser would then load the image requested in the background-image: url(...)
  2. Use an AJAX request to fetch the image upon creating the Poppy element in memory (while still outside of the DOM), so the browser can cache the image, ready to show the user when visible.

I've implemented a version of Option (1) in this branch: saltymouse/poppyjs/tree/init-dom-insert
Possible downsides include having unused Poppy elements bloating the DOM.

Option (2), could potentially cause a delay from when the Poppy is requested (e.g. pop.show()) and when it's shown on screen (waiting for the AJAX to load the image resource).

Looking forward to hear more options and opinions!

@apvarun apvarun added enhancement New feature or request question Further information is requested labels Jul 20, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
enhancement New feature or request question Further information is requested
Projects
None yet
Development

No branches or pull requests

2 participants