jsGears.com 技術論壇 - AJAX, JavaScript, jQuery, 網站開發, 前端效能優化

標題: JavaScript 粒子模擬系統 v0.2 [打印本頁]

作者: wmh 時間: 2009-3-17 00:03 標題: JavaScript 粒子模擬系統 v0.2

Particle system written in pure Javascript v0.2

http://wilq32.googlepages.com/wilq32.particles

JavaScript 也可以這樣用...

[jsg.example]
<iframe src="_lib/others/Wilq32.Particles/Wilq32.Particles.html?text=jsgears.com" width="1200" height="420" frameborder="0" scrolling="no" onfocus="iframefocus()" onblur="iframeblur()"></iframe>
[/jsg.example]

作者在進行這個專案的同時，也學到了一些優化的技巧分享給大家：

將元素隱藏、移動再顯示並不會比較快，直接用這樣去移動是比較快的：
```
element.style.top="10px";
element.style.left="10px";  
```
移動物件的最快方法是直接改變 style 的屬性：
```
element.setAttribute("style","left: 10px; top: 10px");
```
但是在 IE 中，這招無效，最快的方式還是如第一點所述，將 top 和 left 分別指定。

不過再怎麼優化，Client 端的瀏覽器要跑出這樣的效果通常速度都很慢，經過實測，Google Chrome > FireFox > IE
還沒用過 Google Chrome 的人快去下載來試試看喔

歡迎光臨 jsGears.com 技術論壇 - AJAX, JavaScript, jQuery, 網站開發, 前端效能優化 (http://jsgears.com/)