Webanwendungen ersetzen unwissentlich den alten Desktop anwendungen. Sie sind bequemer zu bedienen, einfach zu aktualisieren und nicht an ein Gerät gebunden. Und auch wenn die Nutzer schonend von browserbasierten Webanwendungen zu mobilen wechseln, ist die Nachfrage nach komplexen und raffinierten Apps bereits riesig und wächst weiter., Wenn Sie darüber nachdenken, eine eigene Anwendung zu erstellen, haben Sie wahrscheinlich gehört, dass es zwei Hauptdesignmuster für Webanwendungen gibt: mehrseitige Anwendung (MPA) und einseitige Anwendung (SPA). Und natürlich haben beide Modelle ihre Vor-und Nachteile.

Bevor Sie Ihre Idee in die reale Anwendung verwandeln, müssen Sie eine Reihe wichtiger Fragen beantworten. Um zu entscheiden, welches App-Modell für Sie besser ist, sollten Sie dem Content-First-Ansatz folgen, der die Wichtigkeit betont, Ihre Anwendungsinhalte vor alles andere zu stellen., Dies liegt daran, dass Inhalte der Hauptgrund dafür sind, dass Benutzer die Anwendung verwenden oder nicht. Und das führt uns zu den wichtigsten Fragen: Welche Inhalte möchten Sie präsentieren und welche Inhalte Ihren Nutzern am meisten am Herzen liegen.

Es gibt viele Vor-und Nachteile von SPA sowie von MPA. Ich hoffe, dass die folgenden Zeilen die Unterschiede zwischen diesen beiden Entwurfsmustern beseitigen und Sie näher an den Punkt bringen, an dem Sie wissen, welche Art von Anwendung mehr zu Ihrer Idee passt. Und machen Sie Ihre Idee über die eigene Anwendung wahr.,

Eine einseitige Anwendung ist eine App, die in einem Browser funktioniert und während der Verwendung kein erneutes Laden der Seite erfordert. Sie verwenden diese Art von Anwendungen jeden Tag. Dies sind zum Beispiel: Google Mail, Google Maps, Facebook oder GitHub.
Bei SPAs geht es darum, eine hervorragende UX zu bedienen, indem versucht wird, eine „natürliche“ Umgebung im Browser nachzuahmen — kein erneutes Laden der Seite, keine zusätzliche Wartezeit. Es ist nur eine Webseite, die Sie besuchen und die dann alle anderen Inhalte mit JavaScript lädt — von der sie stark abhängen.,

SPA fordert das Markup und die Daten unabhängig voneinander an und rendert Seiten direkt im Browser. Wir können dies dank der erweiterten JavaScript-Frameworks wie AngularJS, Ember tun.js, Meteor.js, Knockout.js .
Single-Page-Sites helfen, den Benutzer in einem, komfortablen Web-Raum, wo Inhalte an den Benutzer in einer einfachen, einfachen und praktikablen Art und Weise präsentiert.

Vorteile der einseitigen Anwendung:

  • SPA ist schnell, da die meisten Ressourcen (HTML+CSS+Skripte) während der gesamten Anwendungsdauer nur einmal geladen werden. Es werden nur Daten hin und her übertragen.,
  • Die Entwicklung wird vereinfacht und gestrafft werden. Es ist nicht erforderlich, Code zum Rendern von Seiten auf dem Server zu schreiben. Der Einstieg ist viel einfacher, da Sie die Entwicklung normalerweise über eine Dateidatei://URI starten können, ohne einen Server zu verwenden.
  • SPAs sind mit Chrome einfach zu debuggen, da Sie Netzwerkvorgänge überwachen, Seitenelemente und damit verbundene Daten untersuchen können.
  • Es ist einfacher, eine mobile Anwendung zu erstellen, da der Entwickler denselben Backend-Code für Webanwendungen und native mobile Anwendungen wiederverwenden kann.
  • SPA kann jeden lokalen Speicher effektiv zwischenspeichern., Eine Anwendung sendet nur eine Anfrage, speichert alle Daten, kann diese dann verwenden und arbeitet sogar offline.

Nachteile der einseitigen Anwendung:

  • Es ist sehr schwierig und keine leichte Aufgabe, eine einseitige Anwendung SEO-Optimierung zu machen. Sein Inhalt wird von AJAX (asynchrones JavaScript und XML) geladen — eine Methode zum Datenaustausch und Aktualisieren in der Anwendung, ohne die Seite zu aktualisieren.
    UPDATE 27.09.2017: Iris Shaffer hat in ihrem Kommentar richtig darauf hingewiesen, dass dies auch serverseitig möglich ist. In der Tat ist es heute einfacher als früher.,
  • Das Herunterladen ist langsam, da schwere Client-Frameworks auf den Client geladen werden müssen.
  • JavaScript muss vorhanden und aktiviert sein. Wenn ein Benutzer JavaScript in seinem Browser deaktiviert, ist es nicht möglich, die Anwendung und ihre Aktionen korrekt darzustellen.
    UPDATE 27.09.2017: In ihrem Kommentar hat Iris Shaffer bemerkt, dass Sie mit isomorphem Rendering / serverseitigem Rendering die Seite bereits auf dem Server rendern können. Wenn sich das anfängliche Rendern auf dem Server befindet und zwischengespeichert werden kann, ist das Deaktivieren von JS kein Problem, um eine gerenderte Seite abzurufen., Theoretisch ist das richtig. Offensichtlich können Sie auf der Serverseite rendern. Aber der Mangel an JS kann ein Problem für andere Funktionalitäten sein. Viele Dinge können in HTML & CSS aber aus meiner Erfahrung wäre es die Hölle, es auf diese Weise zu tun, anstatt JavaScript zu verwenden.
  • Im Vergleich zur „traditionellen“ Anwendung ist SPA weniger sicher. Aufgrund von Cross-Site Scripting (XSS) können Angreifer clientseitige Skripte von anderen Benutzern in die Webanwendung injizieren.,
  • Speicherverlust in JavaScript kann sogar dazu führen, dass das System langsamer wird
  • In diesem Modell funktionieren die Vor-und Zurück-Tasten nicht mehr.
    UPDATE 27.09.2017: Heute ist es kein Thema mehr.

Mehrseitige Anwendung

Mehrseitige Anwendungen arbeiten „traditionell“. Jede änderung, zB. zeigen Sie die Daten an oder senden Sie sie an Serveranforderungen zurück, um eine neue Seite vom Server im Browser zu rendern. Diese Anwendungen sind groß, größer als SPAs, weil Sie sein müssen. Aufgrund der Menge an Inhalten haben diese Anwendungen viele Ebenen der Benutzeroberfläche., Zum Glück ist es kein Problem mehr. Dank AJAX müssen wir uns keine Sorgen machen, dass große und komplexe Anwendungen viele Daten zwischen Server und Browser übertragen müssen. Diese Lösung verbessert sich und ermöglicht es, nur bestimmte Teile der Anwendung zu aktualisieren. Andererseits erhöht es die Komplexität und ist schwieriger zu entwickeln als eine einseitige Anwendung.

Vorteile der mehrseitigen Anwendung:

  • Es ist der perfekte Ansatz für Benutzer, die eine visuelle Karte benötigen, wohin sie in der Anwendung gehen sollen., Solide, wenige Ebene Menüführung ist ein wesentlicher Bestandteil der traditionellen mehrseitigen Anwendung.
  • Sehr gut und einfach für die richtige SEO-Management. Es gibt bessere Chancen für verschiedene Keywords Rang, da eine Anwendung für ein Keyword pro Seite optimiert werden kann.

Nachteile der mehrseitigen Anwendung:

  • Es gibt keine Option, dasselbe Backend für mobile Anwendungen zu verwenden.
    UPDATE 27.09.2017: damals, als ich diesen Artikel schrieb, hatte ich nicht viel Erfahrung mit backend-und mobile-apps., Es ist für mich jetzt offensichtlich, dass Sie für beide dasselbe Backend verwenden können. Und ich möchte allen Lesern danken, die darauf hingewiesen haben.
  • Frontend-und backend-Entwicklung sind eng gekoppelt.
  • Die Entwicklung wird sehr komplex. Der Entwickler muss Frameworks für Client – und Serverseite verwenden. Dies führt zu einer längeren Zeit der Anwendungsentwicklung.

SPA oder MPA?

Bevor Sie eine Webanwendung bereitstellen, müssen Sie das Ziel berücksichtigen., Wenn Sie wissen, dass Sie mehrere Kategorien benötigen (weil Sie beispielsweise einen Online — Shop betreiben oder viele andere Inhalte veröffentlichen), verwenden Sie eine mehrseitige Website. Wenn Sie sicher sind, dass Ihre Website für ein reines einseitiges Erlebnis geeignet ist, entscheiden Sie sich dafür. Und wenn Sie SPA mögen, aber kaum alles in eine einzelne Seite einfügen können, betrachten Sie stattdessen die Hybrid-Site. Dies ist ein anderer Weg, den ich vorher nicht erwähnt habe. Eine hybride Anwendung nimmt das Beste aus beiden Ansätzen und versucht, die Nachteile zu minimieren., Es ist in der Tat, eine einzelne Seite Anwendung, die URL-Anker als synthetische Seiten ermöglicht mehr in Build-Browser-Navigation und Präferenz-Funktionalität verwendet. Aber das ist das Thema für einen anderen Artikel.

Vielleicht wird in Zukunft jeder einseitiges Anwendungsmodell (einschließlich einer hybriden App) verwenden, da es viele Vorteile zu bringen scheint. Viele Apps auf dem Markt migrieren auf dieses Modell zu. Da einige Projekte jedoch einfach nicht in SPA passen, ist das MPA-Modell immer noch lebendig.

Ursprünglich veröffentlicht von Paweł Skólski unter neoteric.eu/blog am 1. Dezember 2016.