jQuery Mobile und jQuery UI sind tot

Die bekannte JavaScript-Bibliothek jQuery, welche unter anderem zur Manipulation des DOMs genutzt wird, wird von zwei Bibliotheken flankiert, welche sich dem UI annehmen. Die Rede ist von jQuery Mobile und jQuery UI. Mithilfe dieser Bibliotheken ist es möglich Oberflächen für Webanwendungen zu entwickeln.

Eine mittels jQuery UI entwickelte Webapplikation

Während sich die Bibliotheken weiterhin sehr beliebt sind, was sich unter anderen in den Fragen auf Stack Overflow widerspiegelt, gibt es ein Problem mit den Projekten; sie sind praktisch tot. Der letzte Commit für jQuery UI ist vom Mai 2017 und auch die Entwicklung der letzten Jahre von jQuery Mobile ist sehr übersichtlich. Ansonsten sind viele andere Zeichen zu entdecken das die beiden Projekte tot sind.

Für neue Projekte in der Webentwicklung, sollte sich deshalb nach einem anderen Framework für die Erstellung von Weboberflächen umgesehen werden. Eine Alternative stellt unter anderem Framework 7 dar, welches von der Einfachheit der jQuery UI– und jQuery Mobile-Bibliotheken inspiriert ist.

Internationalisierung mittels JavaScript

Für mein neues Projekt Wryte war ich auf der Suche nach einer Möglichkeit die Anwendung zu lokalisieren. Das genutzte Framework 7 unterstützt leider keine Lokalisierung von Haus aus, so das diese nachgerüstet werden musste. Zum Tragen kam hierbei die JavaScript-Bibliothek i18next. Nach dem Download und der Einbindung der Bibliothek kann diese initialisiert werden:

i18next
  .use(window.i18nextBrowserLanguageDetector)
  .init({
    debug: false,
    resources: {
      en: {
        translation: {
          "about": "About"
        }
      },
      de: {
        translation: {
          "about": "Über"
        }
      }
    }
  });

In diesem Fall wird zusätzlich der i18nextBrowserLanguageDetector eingebunden, damit die Sprache des Nutzers automatisch erkannt wird. Anschließend kann die Übersetzung abgerufen werden:

$('#tab-author').html(i18next.t('author'));

Nach diesem Schema lässt sich anschließend die gesamte Anwendung übersetzen. Die offizielle Projektseite von i18next ist unter i18next.com zu finden. Die Quelltexte der einzelnen Projektbestandteile sind auf GitHub zu finden. Lizenziert ist i18next unter der MIT-Lizenz und damit freie Software.

nbsp; in XML

Im HTML existiert für das geschützte Leerzeichen die HTML-Entity:

nbsp;

Bei bestimmten Frameworks aus dem HTML5-Bereich wie Framework 7 kann diese Entity allerdings nicht genutzt werden, da z.B. Unterseiten als XML interpretiert werden und der Parser in diesem Fall mit einer Fehlermeldung reagieren würde. Stattdessen kann für das geschützte Leerzeichen das Zeichen:

 

genutzt werden. Bei diesem Zeichen handelt es sich ebenfalls um das geschützte Leerzeichen.

Framework 7

Bei der Suche nach brauchbaren und kleineren Frameworks für die Entwicklung von Web-Anwendungen bin ich unter anderem über OpenUI gestolpert. Allerdings war das Framework für meine Zwecke etwas zu groß, weshalb ich mich schlussendlich für Framework 7 entschieden habe. Mithilfe des Frameworks ist es möglich Web-Anwendungen zu schreiben, welche unter iOS, Android und auf dem Desktop laufen. Neben der Ausführung im Browser ist es daneben möglich Apps für die mobilen Systeme zu bauen. Framework 7 liefert Themes für iOS und Android mit, so das sich die Elemente an das Betriebssystem anpassen.

Eine Beispiel-App, welche mit Framework 7 erstellt wurde

Die offizielle Seite des Projektes ist unter framework7.io zu finden. Der Quelltext des Framework 7 ist auf GitHub zu finden. Der Quelltext des Frameworks ist unter der MIT-Lizenz lizenziert und damit freie Software.