futurelink

будущая ссылка

Вычисляет замедление курсора, чтобы предсказать, когда ссылка будет нажата.

Установить

 $ npm install --save futurelink

Использование

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

Передайте ему массив или NodeList элементов, и когда курсор приближается к одному из этих элементов, future обратный вызов будет запущен с соответствующим элементом в качестве аргумента. future будет вызываться только один раз для каждого элемента.

Ссылки считываются непосредственно из объекта параметров, поэтому, если вы хотите обновить просматриваемые ссылки (скажем, потому что вы хотите просмотреть некоторые элементы, недавно добавленные в DOM), вы можете сделать это:

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

futurelink ( options ) ;

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

Отключение для разделов страницы/отдельных ссылок

Futurelink не будет просматривать ссылки, в которых есть класс no-futurelink или один из их родительских элементов. Он также смотрит только на внутренние ссылки.

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

Удаление будущей ссылки со страницы

Если вы хотите полностью удалить будущую ссылку, она возвращает функцию teardown , которую вы можете вызвать:

 var teardown = futurelink ( options ) ;

// Later…

teardown ( ) ;

Теперь прослушиватели событий будут удалены, и Futurelink больше не будет сообщать вам, когда ссылки будут нажаты.

Насколько это эффективно

На samknows.com он ускоряет неначальную загрузку страниц в среднем на 870 мс.

Как это работает?

Вы можете увидеть статью об этом на SamKnows Medium.

Использование с фреймворками

• vue-futurelink

Лицензия

Выпущено по лицензии MIT.