Overview
VScroll – Virtual Scroll Made Simple.
Show thousands and thousands of rows and grids with out affecting your web site efficiency, not a bit. Not even a little bit bit.
It’s a quick alternative for the default internet browser scroll and infinite scroll. Impressed by Fb, Twitter and fonts.google.com.
You may head to our web site to learn extra: VScroll
Why use VScroll?
“The DOM isn’t sluggish, you might be.” In the event you do silly issues with the DOM, it would carry out poorly. Like as an illustration including 100+ listing stuffed with components will lower your web site efficiency, it would additionally could result in a really, very poor efficiency which can injury your person expertise.
Internet builders have created an answer, it’s known as infinite scroll characteristic, often known as “unpagination”, is a method the place extra content material for a web page is appended dynamically because the person approaches the tip of the content material. However there’s nonetheless an issue; As you scroll down, the web page begins to get greater and slower, it would begin to present efficiency points.
JaguarScript constructed a greater alternative of the default browser scroll and infinite scroll. You could have seen this system on the Fb’s Timeline or on Twitter’s and It’s impressed by fonts.google.com.
However how does it work? It takes an array of knowledge and returns perform containing every merchandise based mostly on index to create DOM (template for every merchandise). It renders simply sufficient quantity of knowledge to fill the viewport, by implementing a two-way infinite scroll method. For efficiency causes, It doesn’t render each merchandise within the listing without delay.
It requires an array of knowledge, perform that generates and returns HTML templates for every merchandise, and an HTML container aspect.
Options
- Helps Hundreds of thousands of Rows: Means that you can show thousands and thousands of rows and grids with out hurting person expertise. The identical know-how that it’s utilized by huge corporations like Fb and Twitter to show their timelines.
- Grid: It’s not restricted to a listing. It helps lists, ULs, Tables, divs that would comprise something. It additionally helps multi-column, identical to fonts.google.com.
- Two Manner Scroll: VScroll renders simply sufficient quantity of knowledge to fill the viewport, by implementing a two-way infinite scroll.
- Extremely Quick: It doesn’t lower the online web page efficiency, even when the listing is over 100,000 objects, in truth it has many efficiency advantages over the default browser scroll.
- Buffer: You may buffer/prerender the following and the earlier components within the DOM.
- Responsive: Similar to fonts.google.com.
- Dynamic: It may comprise dynamic rising array of knowledge. It has a helpful API the place you possibly can replace, refresh, quick refresh or destroy your digital scroll.
- A number of Situations: You may create a number of cases of VScroll that time to totally different knowledge.
Documentation
Full documentation comprises Set up, Utilization, Choices, API and Browser Help are included within the package deal.
Demo
Right here’s a easy demo, extra examples are included within the package deal:VScroll Virtual Scroll demonstration
Go to Product Web page
VScroll: Virtual Scroll Made Simple
Browser Help
Google Chrome (4+), Mozilla Firefox (3.5+), Apple Safari (3.2+), Opera (10+), Microsoft Edge (all), Web Explorer (9+)