Instantiate template when viewable.
npm install be-lazy
html
I am here
`
The role of be-lazy ends once it becomes viewable, and the content is instantiated. In fact, the template is deleted at that point.
Options include setting IntersectionObserverInit settings:
`html
`
Other configuration settings include "enterDelay" and "exitDelay". The idea behind those settings is if the user is scrolling very quickly, it can slow the scrolling down if it is instantiating templates that have already zoomed past.
be-lazy can hold its own against content-visibility in terms of performance.
It is most effective if content is "paged" -- be-lazy really shouldn't hold a single div tag as shown above, but the amount of content inside should approximately fill the screen.
be-lazy is currently being used by one virtual list - xtal-vlist.
Viewing this element locally
Any web server than can serve static files will do, but...
1. Install git.
2. Fork/clone this repo.
3. Install node.
4. Open command window to folder where you cloned this repo.
5. > npm install
6. > npm run serve
7. Open http://localhost:8000/ in a modern browser.
Running Tests
`
> npm run test
`
Using from CDN:
`html
`
Referencing via ESM Modules:
`JavaScript
import 'be-lazy/be-lazy.js';
``