建站
咨詢
售后
建站咨詢
新聞中心
1.減少onReady事件的數(shù)量
一旦加載了 HTML 頁(yè)面并應(yīng)用了所有 CSS 選擇器，就會(huì)觸發(fā) onReady 事件。通常，開(kāi)發(fā)人員會(huì)在此處放置初始化頁(yè)面組件和啟動(dòng)各種 JavaScript 函數(shù)所需的邏輯。
創(chuàng)新互聯(lián)擁有網(wǎng)站維護(hù)技術(shù)和項(xiàng)目管理團(tuán)隊(duì)，建立的售前、實(shí)施和售后服務(wù)體系，為客戶提供定制化的成都網(wǎng)站設(shè)計(jì)、網(wǎng)站建設(shè)、外貿(mào)網(wǎng)站建設(shè)、網(wǎng)站維護(hù)、服務(wù)器托管解決方案。為客戶網(wǎng)站安全和日常運(yùn)維提供整體管家式外包優(yōu)質(zhì)服務(wù)。我們的網(wǎng)站維護(hù)服務(wù)覆蓋集團(tuán)企業(yè)、上市公司、外企網(wǎng)站、成都商城網(wǎng)站開(kāi)發(fā)、政府網(wǎng)站等各類型客戶群體，為全球上1000家企業(yè)提供全方位網(wǎng)站維護(hù)、服務(wù)器維護(hù)解決方案。
然而，隨著時(shí)間的推移，開(kāi)發(fā)人員傾向于向頁(yè)面添加越來(lái)越多的 onReady 事件。在故障排除例程中，通常會(huì)添加 onReady 事件來(lái)解決問(wèn)題，但不會(huì)在解決問(wèn)題時(shí)將其刪除。其他時(shí)候，與給定 Web 組件關(guān)聯(lián)的 HTML 會(huì)從頁(yè)面中刪除，但相應(yīng)的 onReady 事件不會(huì)，這會(huì)導(dǎo)致多余的 JavaScript 不必要地消耗時(shí)鐘周期。此外，onReady 事件通常被編碼到一個(gè)通用的 JavaScript 文件中，該文件在每次頁(yè)面加載時(shí)都會(huì)運(yùn)行，即使該函數(shù)僅在少數(shù)幾個(gè)頁(yè)面上需要。
2. 使用 let not var
當(dāng)使用 var 關(guān)鍵字聲明 JavaScript 變量時(shí)，它在整個(gè)頁(yè)面的全局范圍內(nèi)，并在頁(yè)面的整個(gè)生命周期中維護(hù)在內(nèi)存中。但是，當(dāng)使用 let 關(guān)鍵字聲明變量時(shí)，將應(yīng)用塊范圍。因此，該變量會(huì)在塊執(zhí)行后從內(nèi)存中刪除。
如果 Ajax 響應(yīng)、JSON 數(shù)據(jù)或 XML 等長(zhǎng)文本字符串保存在全局變量中，瀏覽器會(huì)很快耗盡可尋址內(nèi)存，這將嚴(yán)重影響頁(yè)面性能。一個(gè)非常容易實(shí)現(xiàn)的 JavaScript 性能優(yōu)化技巧就是用 let 替換代碼中的每個(gè) var。
3. 縮小合并
如果你的網(wǎng)頁(yè)鏈接到多個(gè) JavaScript 庫(kù)，一個(gè)快速簡(jiǎn)單的優(yōu)化方法是將所有這些 JavaScript 庫(kù)合并到一個(gè)文件中。
當(dāng) JavaScript 加載時(shí)，它會(huì)阻止其他資源的下載，例如圖像、JSON 和 CSS 文件。并且由于瀏覽器允許與 Internet 建立的外部連接數(shù)量有限，如果你引用了七個(gè)或八個(gè)外部 JavaScript 文件，你可能會(huì)完全阻止下載可能用于呈現(xiàn)內(nèi)容的其他資源顯示在首屏之上。通過(guò)將所有 JavaScript 組合到一個(gè)文件中，只使用一個(gè)外部連接，這允許瀏覽器同步下載其他資源。
另一種減小 JavaScript 文件大小的簡(jiǎn)單方法是對(duì)它們應(yīng)用最小化程序，例如 JSCompress。最小化器會(huì)去除空格和不必要的文本元素，從而減小 JavaScript 文件的大小。反過(guò)來(lái)，這優(yōu)化了 JavaScript 文件的下載時(shí)間。將多個(gè) JavaScript 文件合并為一個(gè)以減少傳出網(wǎng)絡(luò)連接的數(shù)量。
4. 不要重新發(fā)明 JavaScript API
JavaScript 有幾個(gè)內(nèi)置的 API，允許對(duì)集合或數(shù)組進(jìn)行高效的迭代。使用 Array 的原型構(gòu)造函數(shù)，你可以使用類似 lambda 的語(yǔ)法將函數(shù)應(yīng)用于列表中的所有項(xiàng)目或執(zhí)行操作，例如排序或反轉(zhuǎn)。
這些內(nèi)置方法非常高效，并由瀏覽器進(jìn)行了優(yōu)化。但是，一些開(kāi)發(fā)人員并不了解這些方法，而是編寫(xiě)迭代循環(huán)來(lái)達(dá)到相同的目的。
無(wú)需自己重新發(fā)明這些函數(shù)式方法。這不僅浪費(fèi)時(shí)間，而且還引入了不必要的 JavaScript 性能問(wèn)題。
5. 在服務(wù)器上執(zhí)行密集邏輯
將計(jì)算操作卸載到客戶端的能力是客戶端計(jì)算的一個(gè)關(guān)鍵優(yōu)勢(shì)，但客戶端渲染也可能會(huì)給功率不足的手持設(shè)備帶來(lái)巨大的負(fù)載。
例如，如果渲染圖表或電子表格需要大量計(jì)算，并且該計(jì)算導(dǎo)致 JavaScript 性能問(wèn)題，請(qǐng)考慮將其移動(dòng)到服務(wù)器并簡(jiǎn)單地將內(nèi)容作為預(yù)先計(jì)算的 HTML 交付給客戶端。瀏覽器在靜態(tài) HTML 顯示上比在復(fù)雜的、內(nèi)存密集型的 JavaScript 函數(shù)運(yùn)行上要高效得多。
JavaScript 是在最終用戶訪問(wèn)你的網(wǎng)站時(shí)更好地參與和保留他們的關(guān)鍵，但是開(kāi)發(fā)人員應(yīng)該始終意識(shí)到涉及 JavaScript 時(shí)對(duì)性能的影響。注意這五個(gè) JavaScript 性能優(yōu)化技巧，以幫助你的 Web 開(kāi)發(fā)團(tuán)隊(duì)避免一些常見(jiàn)的網(wǎng)站性能陷阱。
當(dāng)前文章：快速網(wǎng)站的簡(jiǎn)單JavaScript性能優(yōu)化技巧
當(dāng)前網(wǎng)址：http://fisionsoft.com.cn/article/dpjdgpp.html
