国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

vue的源碼解析（passive特性，感覺是面試加分項(xiàng)）

0x584a / 1870人閱讀

摘要：突然發(fā)現(xiàn)一個(gè)特性。這里核心是檢查是否支持，是什么提出的一個(gè)新的瀏覽器特性開發(fā)者通過一個(gè)新的屬性來告訴瀏覽器，當(dāng)前頁面內(nèi)注冊的事件監(jiān)聽器內(nèi)部是否會(huì)調(diào)用函數(shù)來阻止事件的默認(rèn)行為，以便瀏覽器根據(jù)這個(gè)信息更好地做出決策來優(yōu)化頁面性能。

今天我看源碼，因?yàn)橐贿吙匆贿呌浌P記所以看的慢。突然發(fā)現(xiàn)一個(gè)特性。所以多帶帶開一篇。
感覺是一個(gè)秀bigger的特性，如果有一天面試官問你發(fā)現(xiàn)優(yōu)化頁面的時(shí)候，
你提出可以檢查瀏覽器是否可以使用該特性。提升滾動(dòng)流暢度。
passive 
  var supportsPassive = false;
  if (inBrowser) {
    try {
      var opts = {};
      Object.defineProperty(opts, "passive", ({
        get: function get () {
          /* istanbul ignore next */
          supportsPassive = true;
        }
      })); // https://github.com/facebook/flow/issues/285
      window.addEventListener("test-passive", null, opts);
    } catch (e) {}
  }
這里核心是檢查是否支持Passive，
tips



1, passive是什么？Chrome提出的一個(gè)新的瀏覽器特性：Web開發(fā)者通過一個(gè)新的屬性passive來告訴瀏覽器，當(dāng)前頁面內(nèi)注冊的事件監(jiān)聽器內(nèi)部是否會(huì)調(diào)用preventDefault函數(shù)來阻止事件的默認(rèn)行為，以便瀏覽器根據(jù)這個(gè)信息更好地做出決策來優(yōu)化頁面性能。當(dāng)屬性passive的值為true的時(shí)候，代表該監(jiān)聽器內(nèi)部不會(huì)調(diào)用preventDefault函數(shù)來阻止默認(rèn)滑動(dòng)行為，Chrome瀏覽器稱這類型的監(jiān)聽器為被動(dòng)（passive）監(jiān)聽器。目前Chrome主要利用該特性來優(yōu)化頁面的滑動(dòng)性能，所以Passive Event Listeners特性當(dāng)前僅支持mousewheel/touch相關(guān)事件


2, Passive Event Listeners特性是為了提高頁面的滑動(dòng)流暢度而設(shè)計(jì)的，頁面滑動(dòng)流暢度的提升，直接影響到用戶對這個(gè)頁面最直觀的感受。這個(gè)不難理解，想象一下你想要滑動(dòng)某個(gè)頁面瀏覽內(nèi)容，當(dāng)你用鼠標(biāo)滾輪或者用手指觸摸屏幕上下滑動(dòng)的時(shí)候，頁面并沒有按你的預(yù)期進(jìn)行滾動(dòng)，此時(shí)你內(nèi)心往往會(huì)感覺到一絲不爽，甚至想放棄該頁面。Facebook之前做了一項(xiàng)試驗(yàn)，他們將頁面滑動(dòng)的響應(yīng)刷新率從60FPS降低到30FPS的時(shí)候，發(fā)現(xiàn)用戶的參與度急速下降。


3,passive的簡單實(shí)現(xiàn)



function handler(event) {
        console.log(event.type); // log event type
    }
document.addEventListener("mousewheel", handler, {passive:true});

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/102666.html

相關(guān)文章

  • vue的源碼解析（passive特性，感覺是面試加分項(xiàng)）

    摘要：突然發(fā)現(xiàn)一個(gè)特性。這里核心是檢查是否支持，是什么提出的一個(gè)新的瀏覽器特性開發(fā)者通過一個(gè)新的屬性來告訴瀏覽器，當(dāng)前頁面內(nèi)注冊的事件監(jiān)聽器內(nèi)部是否會(huì)調(diào)用函數(shù)來阻止事件的默認(rèn)行為，以便瀏覽器根據(jù)這個(gè)信息更好地做出決策來優(yōu)化頁面性能。 今天我看源碼，因?yàn)橐贿吙匆贿呌浌P記所以看的慢。突然發(fā)現(xiàn)一個(gè)特性。所以單獨(dú)開一篇。感覺是一個(gè)秀bigger的特性，如果有一天面試官問你發(fā)現(xiàn)優(yōu)化頁面的時(shí)候，你提出可...

    phodal 評論0 收藏0

  • vue的源碼解析（passive特性，感覺是面試加分項(xiàng)）

    摘要：突然發(fā)現(xiàn)一個(gè)特性。這里核心是檢查是否支持，是什么提出的一個(gè)新的瀏覽器特性開發(fā)者通過一個(gè)新的屬性來告訴瀏覽器，當(dāng)前頁面內(nèi)注冊的事件監(jiān)聽器內(nèi)部是否會(huì)調(diào)用函數(shù)來阻止事件的默認(rèn)行為，以便瀏覽器根據(jù)這個(gè)信息更好地做出決策來優(yōu)化頁面性能。 今天我看源碼，因?yàn)橐贿吙匆贿呌浌P記所以看的慢。突然發(fā)現(xiàn)一個(gè)特性。所以單獨(dú)開一篇。感覺是一個(gè)秀bigger的特性，如果有一天面試官問你發(fā)現(xiàn)優(yōu)化頁面的時(shí)候，你提出可...

    Karrdy 評論0 收藏0

  • Java面試 32個(gè)核心必考點(diǎn)完全解析

    摘要：如問到是否使用某框架，實(shí)際是是問該框架的使用場景，有什么特點(diǎn)，和同類可框架對比一系列的問題。這兩個(gè)方向的區(qū)分點(diǎn)在于工作方向的側(cè)重點(diǎn)不同。 [TOC] 這是一份來自嗶哩嗶哩的Java面試Java面試 32個(gè)核心必考點(diǎn)完全解析（完） 課程預(yù)習(xí) 1.1 課程內(nèi)容分為三個(gè)模塊 基礎(chǔ)模塊： 技術(shù)崗位與面試 計(jì)算機(jī)基礎(chǔ) JVM原理 多線程 設(shè)計(jì)模式 數(shù)據(jù)結(jié)構(gòu)與算法 應(yīng)用模塊： 常用工具集 ...

    JiaXinYi 評論0 收藏0

  • 我是如何準(zhǔn)備阿里的社招面試，給準(zhǔn)備java社招的朋友的一個(gè)建議！

    摘要：第一個(gè)問題阿里面試都問什么這個(gè)是讓我最頭疼的一個(gè)問題，也是群里的猿友們問的最多的一個(gè)問題。我參加的是阿里的社招面試，而社招不同于校招，問題的范圍其實(shí)是很隨機(jī)的。所以，不妨就這兩個(gè)階段，談?wù)勆缯忻嬖嚨臏?zhǔn)備，而不是去把阿里面試的過程背一遍。 引言其實(shí)本來真的沒打算寫這篇文章，主要是記憶力不是很好，不像一些記憶力強(qiáng)的人，面試完以后，幾乎能把自己和面試官的對話都給記下來。自己當(dāng)初面試完以后，除...

    BoYang 評論0 收藏0

發(fā)表評論

0條評論

最新活動(dòng)
閱讀需要支付1元查看
<