手把手教你系列 Particle粒子特效(下)

2021-08-20 22:43:34 字數 2118 閱讀 6439

canvas自適應視窗大小

requestanimationframe代替setinterval

快取windowsize

var particleeffect = ,

init: function

() );

// 生成粒子

var times = this.config.count;

this.particles = ;

while(times--) ));}},

draw: function

() }

}// 繪製粒子和滑鼠之間的連線

for(i = 0; i < this.particles.length; i++) }},

run: function

(config)

};

particleeffect

.run();

var particleeffect = ,

handlewindowresize: function

() };

var particleeffect = ,

draw: function

() ,

supportrequestanimationframe: function

() );}},

run: function

() };

/**

* 測試方法

*/function

test

(executefunc, times)

end = new

date();

console.log(executefunc.name + ' executes ' + num + 'times and takes ' + (end.gettime() - start.gettime()) / 1000 + 's.');

}/**

* 實時獲取視窗大小

*/function

getwindowsizerealtime

() ;

}/**

* 視窗大小從快取中獲取

*/var cache = ;

function

getwindowsizefromcache

() // 執行測試

[1000, 10000, 100000, 1000000].foreach(function

(times) );

// 輸出結果

getwindowsizerealtime executes 1000 times and takes 0.001s.

getwindowsizefromcache executes 1000 times and takes 0s.

getwindowsizerealtime executes 10000 times and takes 0.007s.

getwindowsizefromcache executes 10000 times and takes 0s.

getwindowsizerealtime executes 100000 times and takes 0.051s.

getwindowsizefromcache executes 100000 times and takes 0.001s.

getwindowsizerealtime executes 1000000 times and takes 0.405s.

getwindowsizefromcache executes 1000000 times and takes 0.005s.

var particleeffect = ,

handlewindowresize: function

() }

var utils = ,

getwindowsize: function

() ,

updatewindowsize: function

() // ... 省去其他**

}

手把手教你系列 Particle粒子特效(上)

while true id canvas your browser doesn t support canvas.p canvas html,body 粒子特效 var particleeffect 工具 var utils getwindowwidth function getwindowheig...

手把手教你OA選型

oa選型永遠是oa行業的重要焦點,在選型問題上困擾了很多客戶,雲全oa從這幾個方面教你如何選型。了解研發技術 技術是硬道理。只有過關的技術才會研發出過硬的產品。如果技術不過關,後期將會帶來一系列的問題。同時需要考慮技術的先進性。在現如今社會發展日新月異,今天還遙遙領先的管理模式也許明天就會被淘汰。所...

手把手教你玩轉git

使用以上來寫git命令。mkdir xx 建立乙個空目錄 xx指目錄名 pwd 顯示當前目錄的路徑。git init 把當前的目錄變成可以管理的git倉庫,生成隱藏.git檔案。git add xx 把xx檔案新增到暫存區去。git commit m xx 提交檔案 m 後面的是注釋。git sta...