ECMAScript-Bibliotheken und -Frameworks RIA

Das Web entwicklt sich ...

Das Web entwicklt sich von einem rein statischen "Seiten-Lieferanten" hin zu einem Ausliefern von clienseitigen Web-Applikationen. Das Acronym RIA ( Rich Internet Application, deutsch: reichhaltige Internet-Anwendung) beschreibt eine Anwendung, die Internet-Techniken benutzt und eine intuitive Benutzeroberfläche hat. RIA braucht Programmlogik auf dem Client.

Einleitung Crockford zu JavaScript

Web-Entwicklungen hängen zusammen mit mit den Geräten, verteilten Hardware-Komponenten und gemeinsamen Vereinbarungen ( z.B. Protokollen, Sicherheitsanforderungen ) ( siehe z.B. de.wikipedia Kategorie: Web-Entwicklung , Web-Engineering ).

Nach Crockford ist ECMAScript die "Sprache des Web". ECMAScript ist ein non-proprietärer Standard, aber JavaScript ( Trademark of Oracle Corporation ), JScript ( Microsoft, Windows Script engine;.js,.jse,.wsf,.wsc ), ActionScript ( Macromedia Inc. owned by Adobe Systems ), usw. gehören zu den proprietärer Standards. Geeignete Zusammenstellungen von Web-Funktionalitäten, Objekt-Modulen und Bibliotheken können für das ( clientseitige ) Programmieren von "kleinen" Apps und "schwergewichtige" Web-Anwendungen verwendet werden. Ausgereifte Bibliotheken können bei standardisierten Technologien hilfreich sein. Bei kurzen "Hablbwertszeiten" gibt es häufige Änderungen der Bibliotheken und daraus folgen Anpassungen der Apps.

W3C-Empfehlungen haben eine hohe Verbindlichkeit aber keine gesetzliche Gültigkeit. W3C-Empfehlungen sind patentfreie, unparteiische, plattformunabhängige Quasistandards (bisherige Recommendations des W3C: WCAG, XHTML, SMIL, OWL, XML, XML Schema, DOM, XSL, XSLT, RSS, CSS, XPointer, HTML, PNG, SVG, RDF, XLink, VoiceXML, XPath, XQuery, MathML, XForms). Browser-Entwicklungen und Aktualisierungen bilden lediglich bedingt und oft/meist unvollständig die W3C-Empfehlungen in die Praxis ab. Es gibt Browser-Vergleichstabellen (siehe z.B. github: es5-compat-table für ECMAScript 5. Es gibt Browsertests (siehe z.B. wikipedia: Acid-Browsertests ).

Übesicht zu Web-Bibliotheken Welche ist "am Besten"?

Welche Webframeworks gibt es?
en.wikipedia: Web application frameworks , List of rich Internet application frameworks , de.wikipedia: Liste von Webframeworks

JavaScript-Bibliotheken und -Frameworks (Stand 2011)

Es gibt zahlreiche JavaScript-Frameworks (Stand 2011), wie z.B.
en.wikipedia: JavaScript-Frameworks , de.wikipedia: Framework's (allg) , GWT , YUI , Links ... zu zahlreichen, weniger bekannten JS-Bibliotheken.

Der technologischer Wandel bedingt in der Software-Entwicklung Anpassungen (manuelle/automatisierte Strukturverbesserung, Programm-Quelltext-Anpassungen, funktionale Erweiterungen), wobei das beobachtbare Programm-Verhalten oft beibehalten/aktualisiert und die Code-Lesbarkeit, Code-Verständlichkeit, Code-Wartbarkeit und Code-Erweiterbarkeit verbessert wird. Die Restrukturierung oder Umgestaltung von Quellcode wird Refactoring genannt.

Einige Links:
Bibliotheken (Libraries): DOJO, yui Yahoo, Prototype, Jquery, MochiKit, Ext JS, Open Rico, Qooxdoo, Moo Tools, X library, Fork, OAT, AJS

Effekte (Effects): Script.aculo.us, MooFX, Bytefx, Prototype Windows, Lightbox, Lytebox, Leightbox, GreyBox, Behaviour, Curvy Corners, Nifty Corners, jsScrolling

Tools: XML.ObjTree XML parser, jsvalidate, Form validation, Store json data in cookies, Livepipe Tabs, BSN AutoSuggest, BarelyFitz Tabs, overLIB Tooltips, Kryogenix Sortable tables, FD Sortable tables, JDV Sortable tables, TableKit

Grafik (Graphing): Plotkit, Plotr, EJSChart, TimePlot, Ajax-MGraph

Kryptographie (Math/Cryptography): Sylvester, JavaScrypt, MD5, RSA

AJAX: Bajax, SACK, Plex, Taconite, Sajax, jx, libXmlRequest, Spry (Adobe)

Andere (Other): Bibliothek für funktionale Programmierung stringjs und Code , underscorejs und Docs , JSlibs, DOJO shrinksafe - compression, JSmin - compression, JS flash version detector, Open JSAN, MiniAJAX, Google trends of the major players, Smooth Gallery, Slideshow, Flickrshow

Welches ist "das Beste" Javascript-Framwork?

• Framworks können bequem, hilfreich, robust, stabil, überdimensioniert sein. Eine einfache Nutzung kann oft mit relativ wenig Aufwand hinreichende Ergebnisse haben.
• Bei mehr als 30 Javascript-Framwork und einer "schnellebigen Zeit" hängen die Bewertungen dieser Framworks von den Kenntnissen der einzelnen Frameworks, und dem dynamische Entwicklungstand ( noch im Entstehen oder ist überholt ) der Frameworks ab.
• Die Nutzungsbedingungen von proprietären Frameworks können sich ändern.
• Eine intensive Nutzung eines speziellen, proprietären Frameworks über Jahre hinaus kann das spezielle Framework-Anwender-Wissen und -Kenntnisse mehren.
• Intensive, selektiv-mehrjährige Framework-Kenntnisse und -Erfahrungen können wie eine "gefärbte Brille" wirken, die eine neutrale Gesamtsicht auf alle Framworks einfärbt.
• Framwork können zu langfristigen Abhängigkeiten eines Projektes von diesem Framwork führen. Bei vielfältigen, gewachsenen Verflechtungen des Frameworks kann eine schnelle Ersetzung aufwändig oder beinahe unmöglich sein ( Projekt-Tod ).
• Es gibt gewichtete Untersuchungen, die versuchen, die Qualität von Frameworks zu beurteilen. Beispiel: 10-best-javascript-framwork-2013.

Frameworks für mobile Plattfornem (Stand 2012) propritär?

Frameworks für mobile Plattfornem (Stand 2012)

Im mobilen Bereich gibt es native Apps, hybride Apps und Web-Apps. Gemeinsam ist die Verwendung eines Browsers (siehe de.wikipedia: Mobiles Internet , de.wikipedia: Mobiltelefon ).

Apps-Entwickler sind vielfach mit Besonderheiten beschäftigt und arbeiten bei Multiplattform-Entwicklungen an der Überwindung propritärer Sonderheiten und Begrenzungen. Im einer propritären Welt zielt eine größere Plattformunabhängigkeit auf firmenunabhängige Standards.

Als Geräte-Oberfläche wird vielfach HTML 5 verwendet (localStore, ...; jQuery Mobile, iUI, iWeb-Kit, iQTouch, Sencha Touch, The-M-Project, Framework Jo). Die Programmierung erfolgt (z.B. mit ECMAScript) und den Framework-Methoden.

Bei hybriden Apps nutzt die Interaktion auch spezielle Methoden des Gerätes. PhoneGap benutzt z.B. ein JavaScript-API. Es gibt unterschiedliche Möglichkeiten der Unterstützung von Entwicklungen: QuickConnect, Aptana Studio, Titanium Mobile, Titanium Studio, OpenPlug Studio für ActionScript, MonoDroid, usw.; FoneMonkey, Robotium, Sikuli, Deviceanywhere, MITE, usw ( siehe z.B. en.wikipedia: Mobile application development , en.wikipedia: platforms for mobile devices ).

So eignet sich z.B. jQuery Mobile für JAvaScript-Entwickler, MonoTouch für C#-Entwicler mit iOS und Andrid, Rhodes für Ruby-Entwickler, NS Basic/App Studio für VB-Entwickler, usw. Corona mit Luna für Entwicklung von Spielen.

XMLVM verwendet als Eingangssprache Java und .NET mit XML-Zwischensprachen für Android- und iOS-Apps.

Kurz-Übersicht zu Mobile-Bibliotheken

jQuery Mobile jQuery Mobile ist die mobile Variante von jQuery zur Entwicklung von Webapps. jQuery Mobile ist ein Touch-Optimized Web Framework for Smartphones und Tablets. jQuery Mobile möchte Plattformunabhängig und Geräteunabhängig sein (siehe z.B. en.wikipedia: jQuery Mobile , jQuery Mobile ).

jQuery Mobile hat eine umfangreiche Komponenten-Bibliothek für mobile Endgeräte und wird mit einer eigenen CSS 3 - Datei (Swatches a,b,c,d,e) ausgeliefert. Es gibt auch Komponenten, die keine HTML-Entsprechungen haben, wie z.B. Herade-Bar, Footer-Bar, Dialoge, Slider.

Zum automatischen Anpassen an das aktuelle Geräte wird die Seite beim Laden analysiert und angepaßt. Hierzu werden bei Elementen Aria-Attribute, wie z.B. data-role="header" und data-theme="a" verwendet. Bei kleinem Dokumenten-Umfang können mehrere Seiten mit einem Request gemacht werden, was einen schnellen (augenfreundlichen) Seitenwechsel ergibt (flip, fade, slideup, slidedown, pagecreated-Event, page-show-Event, Touch-Events; Web-Kit). Es gibt Events, wie z.B.

tap:                          Bildschirm berühren und loslassen
taphold:                      Bildschirm länger berühren
swipe, swipeleft, swiperight: Wischbewegung in die Richtung
orientationchange:            Gerät gedreht
scrollstart, scrollstop:      Scrolloperation ausgeführt
pagebeforeshow, pagehow, 
pagebeforehide, pagehide:     Seiten-Trasitionen

PhoneGap (OpenSource, BSD und MIT) versucht die Lücke zwischen Web-App und nativ-App zu schließen, indem die Hardware von mobilen Plattformen durch ein JavaScript-API abstrahiert wird (siehe z.B. en.wikipedia: PhoneGap , PhoneGap ). Die PhoneGap-Bibliothek konzentriert sich auf die Harwarezugriffe und weniger auf die grapfische Oberfläche. PhoneGap verwendet HTML5 und ist für mehrere Plattformen geeignet (native Apps für Android, iOS, BlackBerry, webOS, bada, Symbian und Windows Phone).

PhoneGap kann mit Hilfe des PhoneGap-Packet und iOS-SDK mit Xcode 4.x HTML-Web-Apps in nativ-Apps umwandeln für die Zielplattformen Android, bada, BlackBerry, iOS, Symbian, webOS. Die Unterstützung von Window Phone 7.x ist in Arbeit. PhoneGap hat auch ein JavaScript-API, das We-App erweitert und dadurch z.B. nativ Zugriffe auf Kontaktlisten ermöglicht.

Titanium Mobile unterstützt Web-Apps und beschleunigt Android-Apps. Es können (für iOS und Android) sowohl native Apps als auch Web-Apps in HTML5 einheitlich entwickelt werden. Zur Entwicklungsumgebung Titanium Studio gehören auch ein Dashboard und einen Modul-Wizard (siehe titanium mobile application development ).

the-m-project ist ein Open-Source-Framework, das auf HTML5 und JaavaScript basiert und Anwendungsentwicklungen für unterschiedliche Geräte und mobile Betriebsfunktionen ermöglicht. the-m-project verwendet selbst auch andere Open-Source-Framework, wie z.B. jQuery Mobile, Espresso und Node.js. Unterstützt werden die Zielplattformen Android, iOS, Windows Phone 7, BlackBerry, webOS, Kindle und Nokia Symbian (siehe z.B. en.wikipedia: HTML5 in mobile devices Der Artikel beschreibt kurz auch "Frameworks for app development": jQuery Mobile, Sencha Touch, SproutCore, M-Project, jQTouch, Jo, DHTMLX Touch, WorkLight, MobileNationHQ, BkRender und the-m-project benutzt auch jQuery on the JavaScript iOS, Android, BlackBerry and webOS )

iwebkit iWebKit nutzt für die Entwicklung von Webapps auf iPod, iPhone und iPad Endgeräten eine Html-Datei Vorlage. Die Entwicklung basiert komplett auf HTML, CSS und JavaScript. Die Oberfläche ist optisch für die genannten Endgeräte optimiert, siehe z.B. iwebkit5

YouMinds Composer ist eine Desktop Software die mittels WYSIWYG Bearbeitung Webapps erstellt.

Sencha Touch basiert auf dem W3C-Standards, wie HTML5, CSS3 and ECMAScript. Sencha Touch ist ein umfangreiches JavaScript Framework zur Entwicklung von Webapps. Siehe z.B. en.wikipedia Sencha Touch . Das Skalieren auf das Zielgerät erfolgt mit Hilfe von Sass (Auszeichnungssprache für CSS). Die Verknüpfung von Sass und Javascript hat auch Kritiker.

Der "Weg der Browser-Karawane durch die Zeit" wird an der "Rückwärtskompaktibilität" zu alten Homepages und deren aktueller Anzeige durch unterschiedliche Browser-Versionen sichtbar. Um unschöne Darstellungsgeffekten zu vermeiden gibt es z.B. Conditional Comments (kurz CC) , die als Browserweichen eingebunden werden können. Style-Beispiel für den IE:

<meta http-equiv="X-UA-Compatible" content="IE=8" />
oder auch
<style type="text/css" >
  @import url("/css/styles.css");
</style >
<!--[if gte IE 5]>  <link rel="stylesheet" type="text/css" href="/win_ie.css" /> <![endif]-->
<!--[if IE 6]>  <link rel="stylesheet" type="text/css" href="/css/win_ie6.css" /> <![endif]-->
<!--[if IE 7]>  <link rel="stylesheet" type="text/css" href="/css/win_ie7.css" <![endif]-->

Beispiel: Das Google Web Toolkit (GWT) bietet ein Java-API, um Web-basierte RIAs zu entwickeln. Dazu wird der Java-Code mittels Cross-Compiler in JavaScript-Code umgewandelt. GWT benötigt zur Laufzeit einen aktuellen Browser aber keine Browser-Plugins.