يحسب تباطؤ المؤشر للتنبؤ عندما يكون الرابط على وشك النقر عليه.
$ 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 ) { }
} ) قم بتمرير مصفوفة أو قائمة عقدية من العناصر، وعندما يقترب المؤشر من أحد هذه العناصر، سيتم إطلاق رد الاتصال 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 > إذا كنت تريد إزالة Futurelink بالكامل، فسوف تقوم بإرجاع وظيفة teardown التي يمكنك الاتصال بها:
var teardown = futurelink ( options ) ;
// Later…
teardown ( ) ;ستتم الآن إزالة مستمعي الحدث ولن يخبرك رابط المستقبل عندما تكون الروابط على وشك النقر عليها بعد الآن.
على موقع samknows.com، يعمل على تسريع عمليات تحميل الصفحات غير الأولية بمعدل 870 مللي ثانية.
يمكنك الاطلاع على مقال حول ذلك على SamKnows Medium.
تم إصداره بموجب ترخيص MIT.
