jQuery BlogjQuery Blog http://jquery-blog.de Der deutsche jQuery-Blog Wed, 10 Feb 2010 22:24:14 +0000 en hourly 1 http://wordpress.org/?v=3.3.1 jQuery richtig einbinden http://jquery-blog.de/index.php/2010/01/jquery-richtig-einbinden/ http://jquery-blog.de/index.php/2010/01/jquery-richtig-einbinden/#comments Mon, 04 Jan 2010 12:49:39 +0000 André http://jquery-blog.de/?p=16 Weiterlesen →]]> “Wie verwende ich denn eigentlich JQuery auf meiner Seite richtig”, diese Frage hat sich mir als eine der ersten gestellt und vorallem “wie binde ich jQuery richtig und Performant ein?”. Bevor ich JQuery kannte habe ich mit den schwergewichtigen Bibliotheken wie Scriptaculous und Prototype gearbeitet. Die Ladezeit und die Performance war bei diesen Seiten meist unterirdisch und äußerst langsam. Diese Beobachtung konnte ich bei jQuery zum Glück nicht feststellen, auf den Seiten auf denen jQuery eingebunden ist, ist die Performance der Seiten nach wie vor gut und robust, vielleicht ist dies aber auch ein Punkt der jQuery in den letzten Monaten so populär gemacht hat. Aber gibt es denn einen Weg wie ich jQuery besser einbinden kann, schließlich ist es ja schon eine Menge JavaScript Code den ein Webentwickler einbindet und welcher vom Browser interpretiert werden muss. Also frage ich mich wie? Auf dem normalen Weg? Aber was ist der “normale Weg”.

Aus diesem Grund habe ich versucht hier einmal 2 Arten des einbindens zu dokumentieren.

1. Herunterladen der Datei und ablegen in ein Verzeichnis auf welches vom HTML-Code aus zugegriffen werden kann. (Bei CMS Systemen gibt es hierfür verschiedene Extensions, Module oder Erweiterungen die diesen Vorgang automatisieren, hierzu werde ich einen späteren Blog-Beitrag verfassen.)

<html>
<head>
<script type=”text/javascript” src=”jquery.js”></script>
<script type=”text/javascript”>
// we will add our javascript code here
</script>
</head>
<body>
<!– we will add our HTML content here –>
</body>
</html>

2. Der zweite Weg wäre die sogenannte CDN (Content Delivery Network) Methode, dies bedeuted das die JavaScript Bibliothek von externen Seiten eingebunden wird, diese Methode ist in der hinsicht unbedenklich, da die Seiten die diese Bibliotheken einbinden zu 99,9% verfügbar sind. Die CDN-Methode ist im oberen Link deutlich dokumentiert (Falls hierzu noch fragen bestehen einfach fragen :-) ) Als Beispiel der gleiche Code Snippet wie oben mit der veränderten src

<html>
<head>
<script type=”text/javascript” src=”http://code.jquery.com/jquery-latest.pack.js“></script>
<script type=”text/javascript”>
// we will add our javascript code here
</script>
</head>
<body>
<!– we will add our HTML content here –>
</body>
</html>

Fazit: Das Einbinden von jQuery ist über verschiedene Wege möglich. In der Development Phase kann die Einbindung lokal und als Unkomprimierte Version stattfinden. In der Produktiv Phase sollte jQuery auf jeden Fall in der Minimierten Form eingebunden werden. Mit dem Nutzen der Bibliothek über CDN ist das so eine Frage des Gefühls, wo die Dateien gehostet werden sollen. Allerdings kann ich nur dazu raten, da die Performance durch dieser Form der Einbindung wirklich an Schnelligkeit gewinnt.

Post to Twitter Tweet This Post

]]> http://jquery-blog.de/index.php/2010/01/jquery-richtig-einbinden/feed/ 0 Herzlich Wilkommen und ein gutes neues Jahr http://jquery-blog.de/index.php/2010/01/herzlich-wilkommen-und-ein-gutes-neues-jahr/ http://jquery-blog.de/index.php/2010/01/herzlich-wilkommen-und-ein-gutes-neues-jahr/#comments Sat, 02 Jan 2010 00:07:18 +0000 André http://jquery-blog.de/?p=8 Weiterlesen →]]> Der erste Eintrag für einen Blog mit der Domain jQuery-Blog.de, wie könnte dieser aussehen? Das habe ich mich auch gefragt und habe mich nach einer kurzen Überlegung dazu entschieden erst einmal die Facts von JQuery darzustellen.

Zum jetzigen Zeitpunkt Dezember 2009 liegt das JavaScript Framework in der Version 1.3.2 vor. Zu den aktuellen Releases der Versionen, werde ich sicherlich  auch an dieser Stelle immer einen kleinen Bericht hier auf dem Blog verfassen. Das kleine und äußerst flexible JavaScript Framwork wurde von John Resig entwickelt mit dem Hintergrund den DOM (Document Object Model) eines HTML Dokumentes mit JavaScript abzufragen. Aus diesem Grund auch der Name j steht für JavaScript und Query steht in diesem Fall für die Abfrage des DOM Baumes innerhalb des HTML Dokumentes.

jQuery selbst ist eine sehr schnell und zum jetzigen Zeitpunkt mit einer Größe von 55,9 KB sehr kleine JavaScript Bibliothek. Dieses wiederum ist für die Performance sehr zuträglich und nicht mit anderen Bibliotheken vergleichbar wie zum Beispiel Prototype und das dazugehörige Bibliothek Script.aculo.us.

Die Erweiterung bei jQuery wird durch sogenannt Plugins gesteuert. Somit ist das Framwork nicht nur flexibel sondern auch skalierbar. Im Vergleich zu anderen auf Extensions oder Plugins basierten Systemen ist auch bei jQuery die Auswahl dieser Plugins durch die große Community sehr groß. Hier findet man für fast jeden Fall bereits ein bestehendes Plugin.

Die JavaScript Bibliothek steht wahlweise unter der GPL – General Public License oder unter der MIT eine Lizenz welche vom Massachusetts Institute of Technology entwickelt wurde zur Verfügung.

In einem ersten Blog-Eintrag möchte ich es auch nicht verpassen die wichtigsten Links für die Bibliothek darzustellen. Diese findet Ihr in diesem Artikel und sicherlich auch über mein Link Verzeichnis.

Wer sich über mehr Themen zur Webentwicklung oder über meine Person informieren möchte kann sich entweder über meinen Blog Andre Krug, meine Internetseite, meinen Twitter-Account oder mein Xing Profil informieren.

Links:

Fazit: Die kleine JavaScript Bibliothek jQuery ist äußerst flexibel und skalierbar. Der Einstieg in jQuery ist denkbar einfach. Die Community, welches ein wichtiges Kriterium für eine Bibliothek die unter OpenSource Lizenz steht ist, ist äußerst aktiv.

Post to Twitter Tweet This Post

]]> http://jquery-blog.de/index.php/2010/01/herzlich-wilkommen-und-ein-gutes-neues-jahr/feed/ 2