曾經(jīng)在前端之巔看過(guò)這么一篇文章，標(biāo)題是《網(wǎng)站性能優(yōu)化實(shí)戰(zhàn)——從12.67s到1.06s的故事》，當(dāng)時(shí)我就納悶了，哪來(lái)的網(wǎng)站首屏需要加載12秒，而...
投稿
收錄了10篇文章 · 52人關(guān)注
-
vue項(xiàng)目封裝并發(fā)布無(wú)限滾動(dòng)指令優(yōu)化渲染性能的npm模塊
-
使用SQIP工具和交叉點(diǎn)觀測(cè)器進(jìn)行漸進(jìn)式圖像加載
前言 點(diǎn)擊該鏈接使用SQIP工具和交叉點(diǎn)觀測(cè)器進(jìn)行漸進(jìn)式圖像加載閱讀體驗(yàn)會(huì)更好 在前面一文使用交叉點(diǎn)觀察器延遲加載圖像以提高性能中,已經(jīng)知曉了使...
-
h5報(bào)名頁(yè)性能優(yōu)化總結(jié)最近做了報(bào)名頁(yè)的第三期，就順手對(duì)該項(xiàng)目進(jìn)行了一些優(yōu)化。先看h5報(bào)名頁(yè)優(yōu)化前后性能的對(duì)比吧： 。優(yōu)化前首屏的秒出率大概是30%左右，優(yōu)化后的首屏秒...
-
原生js之列表優(yōu)化-無(wú)限滾動(dòng)實(shí)例
參考 js實(shí)現(xiàn)文字列表無(wú)縫滾動(dòng)效果 參考給出的是一個(gè)字幕自動(dòng)滾動(dòng)的例子，不過(guò)這個(gè)例子有個(gè)坑，就是#rule必須設(shè)置高度，否則的話，看不到滾動(dòng)的效...
-
基于nodejs的雪碧圖制作工具
前顏（yan） 雪碧圖（CSS sprite ），就是把很多小圖標(biāo)合并為一張圖片。 在Web開(kāi)發(fā)中，使用雪碧圖是優(yōu)化Web性能的一種方法。 比如...
-
CDN簡(jiǎn)談及實(shí)現(xiàn)原理分析很多人可能不了解cdn，認(rèn)為自己沒(méi)用過(guò)cdn，其實(shí)不然，我們已經(jīng)在用了。先舉個(gè)栗子，大家有沒(méi)有想過(guò)為什么雙十一的時(shí)候這么多人搶購(gòu)，流量超級(jí)大，為...
-
前端｜訪問(wèn)短鏈接請(qǐng)加斜杠最近leader給我提了一個(gè)優(yōu)化,像訪問(wèn) https://example.com/acts/alibaba 這樣的地址時(shí)要寫成 https:/...
-
前端｜加載的圖片太多或太大如何優(yōu)化(上)摘要 web性能的終極目標(biāo)是減少資源到客戶端的延遲,但是我們?cè)贖TTP1.0/HTTP1.1協(xié)議中經(jīng)常會(huì)遇到加載的圖片太多或者太大導(dǎo)致頁(yè)面加載完...
-
吞吐率、吞吐量、TPS、性能測(cè)試，紙上不談兵-構(gòu)建高性能Web站點(diǎn)
一、吞吐率 我們一般使用單位時(shí)間內(nèi)服務(wù)器處理的請(qǐng)求數(shù)來(lái)描述其并發(fā)處理能力。稱之為吞吐率（Throughput），單位是 “req/s”。吞吐率特...
-
前端工程師需要思考什么
最近心浮氣躁，瑣事纏身，不能好好的碼文字，不能好好的敲代碼?？床幌氯ゾ蛧L試寫下來(lái)，用文字整理思路。先給大家推薦一篇文章《怎么判定web前端架構(gòu)師...
{var%20f='http://v.t.sina.com.cn/share/share.php?appkey=1881139527',u=z||d.location,p=['&url=',e(u),'&title=',e(t||d.title),'&source=',e(r),'&sourceUrl=',e(l),'&content=',c||'gb2312','&pic=',e(p||'')].join('');function%20a(){if(!window.open([f,p].join(''),'mb',['toolbar=0,status=0,resizable=1,width=440,height=430,left=',(s.width-440)/2,',top=',(s.height-430)/2].join('')))u.href=[f,p].join('');};if(/Firefox/.test(navigator.userAgent))setTimeout(a,0);else%20a();})(screen,document,encodeURIComponent,'','','https://upload.jianshu.io/collections/images/27418/7983aab7a2d28a2fc38746243872ab9e.png', '推薦專題《前端性能優(yōu)化》（ 分享自 @簡(jiǎn)書 ）','http://www.itdecent.cn/c/2a50de9d570e?utm_campaign=maleskine&utm_content=collection&utm_medium=reader_share&utm_source=weibo','頁(yè)面編碼gb2312|utf-8默認(rèn)gb2312'));){kind=link}