futurelink

enlace futuro

Calcula la desaceleración del cursor para predecir cuándo está a punto de hacer clic en un enlace.

Instalar

 $ npm install --save futurelink

Uso

 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 ) { }
} )

Pásele una matriz o NodeList de elementos, y cuando el cursor se acerque a uno de esos elementos, la future devolución de llamada se activará con el elemento en cuestión como argumento. future solo se llamará una vez por elemento.

Los enlaces se leen directamente desde el objeto de opciones, por lo que si desea actualizar los enlaces que se están viendo (por ejemplo, porque desea ver algunos elementos recién agregados al DOM), puede hacer esto:

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

futurelink ( options ) ;

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

Deshabilitar secciones de la página/enlaces individuales

Futurelink no examinará los enlaces que no-futurelink o uno de sus elementos principales. También solo mira los enlaces internos.

 < 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 >

Eliminando enlace futuro de la página

Si desea eliminar por completo Futurelink, devuelve una función teardown a la que puede llamar:

 var teardown = futurelink ( options ) ;

// Later…

teardown ( ) ;

Ahora los detectores de eventos se eliminarán y Futurelink ya no le dirá cuándo está a punto de hacer clic en los enlaces.

¿Qué tan efectivo es?

En samknows.com, acelera las cargas de páginas no iniciales en un promedio de 870 ms.

¿Cómo funciona?

Puede ver un artículo sobre eso en SamKnows Medium.

Uso con marcos

• enlace-vue-futuro

Licencia

Publicado bajo la licencia MIT.