Infinity.js, alléger les pages qui présentent de longues listes d’items


Infinity.js est un script qui reproduit le comportement de UITableView. Il permet d’accélérer le scrolling sur les sites présentant de très longues listes d’éléments comme Pinterest.
Il fonctionne en ajoutant ou supprimant dynamiquement des éléments en fonction de la position dans la liste. Ainsi, la page reste légère et évite les repaints inutiles.
La navigation s’en trouve plus rapide et harmonieuse.

L’utilisation de la bibliothèque est très simple :

    var $el = $('#my-infinite-container');
    var listView = new infinity.ListView($el);
     
    // ... When adding new content:
     
    var $newContent = $('<p>Hello World</p>');
    listView.append($newContent);
     
    // ... To remove items from a list:
     
    var listItems = listView.find('.my-items');
    for(var index = 0, length = listItems.length; index < length; index++) {
    listItems[index].remove();
    }

Infinity implémente également une fonctionnalité de lazy loading pour les images. De quoi aller encore plus vite.
La seule dépendance est avec jQuery.

Pour info, Infinity.js a été développé par Airbnb.

Téléchargez Infinity