|
我經(jīng)常抱怨jQuery的DOM操作性能并不優(yōu)秀,并且經(jīng)常嘗試用一些方法去進行優(yōu)化,但是越是優(yōu)化,越是沮喪地發(fā)現(xiàn)jQuery其實已經(jīng)做得很好,從使用者的角度能夠進行的優(yōu)化實在有限(這并不意味著jQuery的性能是優(yōu)秀的, 反之只能說它是一個相對封閉的庫,無法從外部介入進行優(yōu)化)。這篇文章就記錄一次失敗的優(yōu)化經(jīng)歷。
優(yōu)化思想
這一次優(yōu)化的思想來自于數(shù)據(jù)庫。在數(shù)據(jù)庫優(yōu)化的時候,我們常會說將大量的操作放在一個事務(wù)中一起提交,能有效提高效率。雖然對數(shù)據(jù)庫不了解的我并不知道其原因,但是事務(wù)的思想?yún)s為我指明了方向(雖然是錯的)。
因此我嘗試將事務(wù)這一概念引入到j(luò)Query中,通過打開和提交事務(wù),從外部對jQuery進行一些優(yōu)化,其最重要的在于減少each函數(shù)的循環(huán)次數(shù)。
眾所周知,jQuery的DOM操作,以get all, set first為標(biāo)準(zhǔn),其中用于設(shè)置DOM屬性/樣式的操作,幾乎都是對選擇出來的元素的一次遍歷,jQuery.access函數(shù)就是其中最核心的部分,其中用于循環(huán)的代碼如下:
// Setting one attribute
if ( value !== undefined ) {
// Optionally, function values get executed if exec is true
exec = !pass exec jQuery.isFunction(value);
for ( var i = 0; i length; i++ ) {
fn(
elems[i],
key,
exec ? value.call(elems[i], i, fn(elems[i], key)) : value,
pass
);
}
return elems;
it知識庫:記一次失敗的jQuery優(yōu)化嘗試,轉(zhuǎn)載需保留來源!
鄭重聲明:本文版權(quán)歸原作者所有,轉(zhuǎn)載文章僅為傳播更多信息之目的,如作者信息標(biāo)記有誤,請第一時間聯(lián)系我們修改或刪除,多謝。