futurelink

Zukunftslink

Berechnet die Verzögerung des Cursors, um vorherzusagen, wann auf einen Link geklickt werden wird.

Installieren

 $ npm install --save futurelink

Verwendung

 var futurelink = require ( 'futurelink' ) ;

futurelink ( {
  links : document . querySelectorAll ( 'a' ) ,
  future : function ( link ) {
    // `link` is probably going to be clicked soon
    // Preload some images, if you can!
  } ,
  
  // These also exist, but aren't usually needed:
  hover : function ( link ) { } ,
  click : function ( link ) { }
} )

Übergeben Sie ihm ein Array oder eine NodeList von Elementen, und wenn sich der Cursor einem dieser Elemente nähert, wird der future Rückruf mit dem betreffenden Element als Argument ausgelöst. future wird nur einmal pro Element aufgerufen.

Die Links werden direkt aus dem Optionsobjekt gelesen. Wenn Sie also die überwachten Links aktualisieren möchten (z. B. weil Sie einige neu zum DOM hinzugefügte Elemente überwachen möchten), können Sie Folgendes tun:

 var options = {
  links : document . querySelectorAll ( 'a' ) ,
  future : function ( link ) { }
} ;

futurelink ( options ) ;

router . afterEach ( function ( ) {
  options . links = document . querySelectorAll ( 'a' ) ;
} ) ;

Deaktivierung für Abschnitte der Seite / einzelne Links

Futurelink prüft keine Links, die eine no-futurelink -Klasse oder eines ihrer übergeordneten Elemente enthalten. Es werden auch nur interne Links betrachtet.

 < div class =" no-futurelink " >
  < a href =" /foo-bar " > Futurelink won't tell you about this link </ a >
</ div >

< a href =" /bar-foo " class =" no-futurelink " > It won't tell you about this one either </ a >

Futurelink wird von der Seite entfernt

Wenn Sie Futurelink vollständig entfernen möchten, gibt es eine teardown -Funktion zurück, die Sie aufrufen können:

 var teardown = futurelink ( options ) ;

// Later…

teardown ( ) ;

Jetzt werden die Ereignis-Listener entfernt und Futurelink teilt Ihnen nicht mehr mit, wann Links angeklickt werden.

Wie effektiv ist es?

Auf samknows.com beschleunigt es nicht-erste Seitenladevorgänge um durchschnittlich 870 ms.

Wie funktioniert es?

Einen Artikel dazu finden Sie auf dem SamKnows-Medium.

Verwendung mit Frameworks

• vue-futurelink

Lizenz

Veröffentlicht unter der MIT-Lizenz.