Łukasz Gąsior
  • Home
  • now!
  • Blog
  • Po polsku
Social Links
Twitter
LinkedIn
Facebook
YouTube
Reddit
Instagram
GitHub
Medium
RSS
Łukasz Gąsior
  • Home
  • now!
  • Blog
  • Po polsku

Posts by tag

jQuery 1.4

2 posts
  • Po polsku

jQuery 1.4 vs. jQuery 1.3.2

  • 2010-01-17
  • One comment

Poprzednio informowałem o wydaniu nowej wersji biblioteki jQuery – 1.4.
Teraz pora aby przyjrzeć się jej dokładniej: na początek postanowiłem sprawdzić wydajność dwóch często wykorzystywanych przeze mnie metod: html() oraz remove().
Test metody html() polegał na wykonaniu jej w pętli – 100 powtórzeń. Kod dla wersji 1.4 oraz 1.3.2 był identyczny:
[sourcecode language=”jscript”] $("#htmlTest").click(function() {
perfChecker.setStartTime();
for (i = 0; i < 100; i++) {
$("#results").html(testMessage);
}
alert(perfChecker.getDiff());
});
[/sourcecode] dodatkowo wykonałem ten test wykorzystując metodę standardowo dostępną w JavaScripcie – bez dodatkowych bibliotek:
[sourcecode language=”jscript”] $("#htmlTest").click(function() {
perfChecker.setStartTime();
for (i = 0; i < 100; i++) {
document.getElementById(‘results’).innerHTML = testMessage;
}
alert(perfChecker.getDiff());
});
[/sourcecode] Każdy z testów wykonałem 5 razy. Przedstawiony poniżej wykres przedstawia średni czas pojedynczego wykonania metody html(). Zmienna testMessage zawierała kod html składający się ze 100 paragrafów (<p>); każdy z nich zawierał 200 literowy tekst.
Test metody remove() polegał na usunięciu 1000 paragrafów (<p>) zagnieżdżonych w divie:
[sourcecode language=”jscript”] $("#removeTest").click(function() {
perfChecker.setStartTime();
$("#results2 p").remove();
alert(perfChecker.getDiff());
});
[/sourcecode] Tutaj również postanowiłem porównać czas wykonania standardowych metod javascript:
[sourcecode language=”jscript”] $("#removeTest").click(function() {
perfChecker.setStartTime();
var a = document.getElementById(‘results2’);
var b = a.getElementsByTagName(‘p’);
var len = b.length;
for (var i = len; i > 0; i–) {
a.removeChild(b[i-1]);
}
alert(perfChecker.getDiff());
});
[/sourcecode] Rzadko piszę kod w czystym JavaScripcie, dlatego jeżeli znacie bardziej wydajny sposób na usunięcie paragrafów z diva to podajcie kod w komentarzu.
A teraz pora na wyniki:
jquery_perf_test
Jak widać jQuery w wersji 1.4 całkowicie deklasuje wersję 1.3.2.
Jeżeli chodzi o konfrontacje z klasycznym JavaScriptem to w przypadku “zwykłej” zmiany zawartości elementów jQuery jest trochę wolniejszy. Jednak jeżeli weźmiemy pod uwagę łatwość pobierania elementów w jQuerym, to różnica ta nie odgrywa większej roli.
W przypadku bardziej złożonych operacji jQuery w wersji 1.4 poradził sobie najlepiej – ale tutaj mógł zaistnieć problem nie do końca optymalnej metody JavaScript użytej w teście.
Mam nadzieję, że ten post zachęci Was do dokładniejszego przyjrzenia się nowej bibliotece.
Zapraszam na kolejne posty związane z jQuerym 1.4.

Share
  • Po polsku

jQuery 1.4 już jest!

  • 2010-01-14
  • 2 komentarze
Na początku chciałbym serdecznie powitać wszystkich Czytelników mojego bloga w nowym, dotnetowym 2010 roku! Niezmiernie trudno podnieść się po długiej, świątecznej przerwie, ale kiedyś do świata żywych powrócić trzeba. Na…
Share
click & help!
Nakarm dziecko!
Follow me
RESHARPER ESSENTIALS
ReSharper Essentials
CODINGTV();
codingtv();
Twitter Feed
Categories
  • Azure Cloud (6)
  • Po polsku (104)
  • Windows (1)
Featured Posts
  • Azure Activity Log – Change History
    • 2020-09-29
  • Diagram Driven Cloud Infrastructure with Cloud Maker
    • 2020-09-22
  • Azure ARM template, but it is not JSON!
    • 2020-09-15
About
👍 Cloud | DevOps | Development | Technical Leadership | 📗Author of "ReSharper Essentials
© 2019 Łukasz Gąsior. All rights reserved.
hosted with ♥️ on webio | Polityka prywatności

Input your search keywords and press Enter.