innerHTML VS DOM


FF เร็วกว่า IE อันนี้ไม่น่าแปลกใจ........... แต่ Opera นี่มันเร็วกว่าชาวบ้านเยอะจัง!!
innerHTML VS DOM อะไรเร็วกว่ากัน?
คุณ Gleb Lebedev ได้ เขียนblog http://www.gloo.ru/blogs/gloom.dhtml_javas..._l_en.wiki.aspx เกี่ยวกับการทดสอบ innerHTML VS DOM ระหว่าง FF 1.5, IE 6, and Opera 9! ด้วยเครื่อง Acer notebook , Microsoft Windows XP x64 Pro, AMD Turion 64 x2 Mobile, 1.60GHz, 1.37GB Ram.

ผลการทดสอบ

innerHTML property
user posted image

DOM .createElement javascript code
user posted image

DOM .cloneNode javascript code
user posted image

FF เร็วกว่า IE อันนี้ไม่น่าแปลกใจ........... แต่ Opera นี่มันเร็วกว่าชาวบ้านเยอะจัง!! blink.gif

และ Windows 64 Bit & IE 64bit ไม่ได้ช่วยให้ JavaScript ทำงานเร็วขึ้น

น่าเสียดาย คุณ Gleb Lebedev ไม่มี Safari เลยไม่ได้ทดสอบ ใครมีก็ช่วยทดสอบหน่อยแล้วกันครับ
ที่หน้าเพจ http://www.gloo.ru/app/jsbenchmarks/DHTMLBenchmark.aspx

สำหรับผม
FF (Thai Firefox Community Edition, 1.5.0.7) 32bit
Result: node.innerHtml=... 354.4 377.1 375.7 377.1 363.3
Result: document.createElement('... = 41.5 106.6 107.6 110.6 108.6
Result: document.cloneNode('... = 109.5 100.7 108.6 108.6 107.6


IE 6.0.2900 32bit
Result: node.innerHtml=... 184.6 141.2 120.4 97.7 81.9
Result: document.createElement('... = 33.6 30.6 28.2 27.2 17.5
Result: document.cloneNode('... = 25.8 23.7 26.7 25.7 21.7

อ้อ ใครมี IE 7, Safari หรือ Browser อื่นๆ ช่วยทดสอบก็ดีนะครับ

Links
http://www.gloo.ru
DHTML JavaScript Benchmark (DOM and innerHTML)
หมายเลขบันทึก: 55260เขียนเมื่อ 20 ตุลาคม 2006 14:40 น. ()แก้ไขเมื่อ 22 มิถุนายน 2012 16:11 น. ()สัญญาอนุญาต: จำนวนที่อ่านจำนวนที่อ่าน:


ความเห็น (6)

รู้น้อยครับ ไม่เข้าใจ

ทดสอบความเร็ว

ความเร็วของการทำงานชนิดไหน? อะไรครับ?

ความเร็วออกมาเป็นหน่วยอะไรครับ ทำไมกราฟ บอกแค่ xxx per second?

 อยากรู้ครับ กรุณาด้วย

เป็นการทดสอบความเร็วเฉพาะการประมวลผลของ innerHTML VS DOM ครับ  ซึ่งไม่ได้หมายความว่า Browser ใดจะทำงาน"โดยรวม" เร็วกว่ากัน

 เป็นที่รู้กันว่า JavaScript มีความเร็วในการประมวลผลช้า  ดังนั้นคุณ Gleb Lebedev จึงทดสอบว่า ระหว่าง innerHTML และ DOM อะไรจะเร็วมากกว่ากัน

การทดสอบใช้วิธีวนรอบและเขียนข้อความ ด้วยการอ้างอิง DOM และ innerHTML

เมื่อทราบว่า innerHTML มีความเร็วในการทำงานมากกว่า  จะมีประโยชน์ในการเลือกใช้งาน โดยเฉพาะ นักพัฒนาที่ใช้ Ajax

ลองศึกษาเรื่อง HTML, DHTML, JavaScript, DOM ครับ

่อ่อครับเข้าใจขึ้นมาหน่อยนึงแล้วครับ ขอบคุณครับ

เอาผลไออี7กับff2.0มาให้ครับ

ff -

Result: node.innerHtml=... 272.0 143.0 125.0 131.0 116.0
Result: document.createElement('... = 103.0 82.8 50.0 53.0 31.6 
Result: document.cloneNode('... = 101.0 105.0 100.0 22.0 107.0
 
ie7 -
Result: node.innerHtml=... 294.0 265.0 264.0 246.0 242.0
Result: document.createElement('... = 95.0 100.0 90.0 90.0 78.0
Result: document.cloneNode('... = 103.0 99.0 94.0 92.0 87.0
 
ie7ประมวลเร็วกว่าffครับ ไม่น่าเชื่อ 

 

IE 7
Result: node.innerHtml=... 227.0 253.0 302.0 286.0 274.0
Result: document.createElement('... = 103.0 101.0 96.0 92.0 89.0
Result: document.cloneNode('... = 105.0 100.0 97.0 93.0 89.0


FF 2
Result: node.innerHtml=... 313.0 285.0 256.0 342.0 154.3
Result: document.createElement('... = 105.0 121.0 115.0 121.0 117.0
Result: document.cloneNode('... = 123.0 118.0 125.0 115.0 122.0


Safari 3 for windows
Result: node.innerHtml=... 1614.0 1638.0 1667.0 1658.0 1655.0
Result: document.createElement('... = 470.0 469.0 435.0 486.0 454.0
Result: document.cloneNode('... = 269.6 387.0 276.0 325.0 316.0


Netscape 9
Result: node.innerHtml=... 400.0 412.0 397.0 404.0 404.0
Result: document.createElement('... = 108.0 124.0 125.0 124.0 125.0
Result: document.cloneNode('... = 116.0 109.0 124.0 120.0 118.0


Safari กินขาด
พบปัญหาการใช้งานกรุณาแจ้ง LINE ID @gotoknow
ClassStart
ระบบจัดการการเรียนการสอนผ่านอินเทอร์เน็ต
ทั้งเว็บทั้งแอปใช้งานฟรี
ClassStart Books
โครงการหนังสือจากคลาสสตาร์ท