2023-09-23 分類: 網站建設
通常,在他們的網站上實現新功能時,用戶將使用其他開發人員設計的預構建代碼片段,而不是自己編寫代碼。這有雙重好處;沒有經驗的開發人員能夠利用更強的功能,這些功能對他們來說很難單獨編碼,即使有經驗的用戶也可以通過使用預先編寫的代碼段來節省時間。
但是,隨著瀏覽器的更新和改進,它們通常會添加對以前只能通過腳本實現的功能的支持。未能使我們的內容適應這些創新可能會阻止我們的網站充分發揮其潛力,因此跟上瀏覽器更新中引入的新特性和功能以保持我們的網站平穩有效地運行非常重要。以下是三個相對較新的瀏覽器功能可以更有效地解決問題的示例:
示例 1:圖像的延遲加載
直到幾年前,如果我們想要延遲加載圖像(即只在用戶滾動到圖像時加載圖像,而不是在初始頁面加載時加載圖像,讓用戶更快地看到頁面內容),一個非常常見的解決方案是用 data-src 屬性替換圖像中的 src 屬性,然后通過瀏覽器窗口的 onscroll 事件跟蹤用戶在網站中的滾動。
示例 2:滾動頁面時激活項目
多年來,我們從 onscroll 事件中獲得了很多進展;除了用于延遲加載圖像外,它還經常用于在給定網頁的某些點觸發事件。例如,我們可能希望在用戶從頁面頂部滾動時出現一個粘性菜單。目前,更強大的解決方案是API;有了這個,我們可以在相對于頁面元素或元素組的可見性的特定時刻觸發事件。這使其成為粘性菜單、滾動期間觸發的動畫或僅用于分析、跟蹤用戶是否查看給定項目的理想解決方案。
示例 3:跟蹤網站更改
將我們的網站腳本與其他外部腳本鏈接起來可能是一個相當大的挑戰;如果我們的腳本沒有使用方便的 API 或引發任何類型的事件,那么我們就無法監控更改。這可以通過循環執行腳本來克服,這些腳本將驗證頁面上的腳本是否有任何重要的更改,但使用API,它允許我們跟蹤在不同級別的特定元素中發生的更改- 無論是 HTML 結構、文本還是屬性。
與 CSS 和 HTML 一樣,縮小和壓縮 JavaScript 代碼以節省帶寬并減少網站加載時需要運行的查詢數量始終是一個好主意。 在 JS 代碼的情況下,縮小腳本的工具比 CSS 代碼具有更大的范圍,因為通常有更簡單的方法來簡化腳本構造,盡管如果您希望稍后檢查腳本,這當然會使它們的可讀性降低. 另外,我們應該特別注意我們的腳本加載的順序;低效的加載順序可能導致用戶不必要的加載延遲和整體更差的用戶體驗。
文章題目:JavaScript對網站制作的速度和性能有什么影響
URL分享:http://vcdvsql.cn/news30/283280.html
成都網站建設公司_創新互聯,為您提供品牌網站制作、全網營銷推廣、定制開發、品牌網站建設、做網站、網站內鏈
聲明:本網站發布的內容(圖片、視頻和文字)以用戶投稿、用戶轉載內容為主,如果涉及侵權請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網站立場,如需處理請聯系客服。電話:028-86922220;郵箱:631063699@qq.com。內容未經允許不得轉載,或轉載時需注明來源: 創新互聯
猜你還喜歡下面的內容