Hallo, meine Frage ist zwar nur im weitesten Sinne PC-Programmierung, aber vielleicht kann mir hier trotzdem jemand einen schnellen Tipp geben. Ich bin gerade dabei ein Webinterface zu bauen. Das ganze wird lokal im Netzwerk laufen, von daher ist es wohl nicht notwendig noch das letzte kB irgendwo einzusparen. Weil Frames ja nun irgendwie nicht mehr so der Renner sind habe ich mal versucht es ein wenig moderner aufzubauen. Darum besteht die Startseite nun aus einem html File, dass eine Box mit den Navigationslinks enthält. Meine Frage ist nun: Wie baut man so etwas heutzutage schlau auf? Möglichkeit 1: Ich fange den Klick auf den Link mittels Javascript ab und lade per JavaScript nur den div Container nach in dem die ausgewählte Seite erscheinen soll. Dann bekomme ich aber wahrscheinlich irgendwann Probleme mit JS Funktionen die auf Elemente angewendet werden sollen, die es nicht mehr oder noch nicht gibt. Außerdem weiß ich nicht, ob es evtl. Probleme mit dem Browser Cache geben könnte. Möglicheit 2: Ich baue für jeden Link so eine HTML Seite die bis auf den angesprochenen Container genauso aussieht wie die andere. Dann habe ich keine Cache oder JS Probleme, aber ich muss dann jede Änderung an allen Seiten einpflegen. Irgendwie gefallen mir beide Konzepte nicht so richtig. Wie macht man sowas denn normalerweise im professionellen Bereich? Vielen Dank Philipp PS: jquery und jqueryUI werden ohnehin verwendet, falls es hierüber einen eleganten Weg gibt
Philipp schrieb: > Irgendwie gefallen mir beide Konzepte nicht so richtig. Wie macht man > sowas denn normalerweise im professionellen Bereich? Templating
Dann muss ich ja den kram durch ein Tool schicken, dass mir dann die Seiten daraus baut.
Philipp schrieb: > Möglicheit 2: > Ich baue für jeden Link so eine HTML Seite die bis auf den > angesprochenen Container genauso aussieht wie die andere. Dann habe ich > keine Cache oder JS Probleme, aber ich muss dann jede Änderung an allen > Seiten einpflegen. Eigentlich "macht man das so". Meist hat man aber ein serverseitiges Skript im Hintergrund, das den Inhalt und die Struktur zusammenbaut. Schau dir z.B. mal PHP an.
Du hast doch sowieso eine Serverseite. Dort bestimmst du was gecacht wird und was nicht, egal ob du jeweils die ganze HTML Seite lädst oder nur Teile. Mit JS wirkt es halt netter ist aber nicht nötig. Siehe Autor PM, mit php oder ähnlichem brauchst du nicht jede Seite von vorne bauen.
Vielen Dank für die schnellen Kommentare! PHP läuft ohnehin auf dem Rechner und in der alten Version dieser Software wurde auch alles mit PHP zusammengebaut. Ich wollte das Ganze jetzt etwas moderner gestalten und nicht bei jedem Klick die Seite neu laden (Navigation ist natürlich schon was anderes). Von jemand anderen habe ich noch den Tipp bekommen einfach alle div Container in die Seite zu packen (sind eh weniger als 10 Navigationspunkte) und die nicht ausgewählten auszublenden. Wahrscheinlich werde ich es genau so machen, dann können auch ausgeblendete Elemente im Hintergrund aktuell gehalten werden und ein Klick durch die Navigation läuft nur lokal ab und man hat das Ergebnis sofort.
Unter dem Stichwort Single-page-Webanwendung setzt sich zur Zeit eine 3. Variante durch. Du baust ein Anwendungsprogramm in Javascript, was nur die Daten vom Server holt. Mit diesem Stichwort findest du verschiedene Frameworks und Tutorials. Alles noch nicht so wirklich überzeugend, aber besser, als selbst wieder von Null anfangen.
Noch einer schrieb: > Du baust ein Anwendungsprogramm in Javascript, was nur > die Daten vom Server holt. An so etwas habe ich auch gedacht. Als Server soll später mal ein Raspberry Pi zum Einsatz kommen. Da ist es sicher nicht verkehrt möglichst viel auf den Clients laufen zu lassen. Leider bin ich in JavaScript noch ein totaler Anfänger. Mit PHP habe ich schon einiges gemacht. Da stellt sich dann schon die Frage ob das PHP Script wirklich nur die Daten in JSON schicken sollte und man Tabellen usw. daraus dann in JS zusammenbaut oder ob man die Tabellen vielleicht doch in PHP erzeugt und dann nur in die Container lädt.
Philipp schrieb: > Leider bin ich in JavaScript noch ein totaler Anfänger. Mit PHP habe ich > schon einiges gemacht. Da stellt sich dann schon die Frage ob das PHP > Script wirklich nur die Daten in JSON schicken sollte und man Tabellen > usw. daraus dann in JS zusammenbaut oder ob man die Tabellen vielleicht > doch in PHP erzeugt und dann nur in die Container lädt. Das kannst du machen, wie du es möchtest. Ggfs. auch unterschiedlich, je nachdem, wie es gerade einfacher ist. Schau dir mal jQuery an, dort speziell die AJAX-Aufrufe: https://api.jquery.com/jquery.get/ http://api.jquery.com/load/ Darüber hinaus gibt es natürlich vollständige MVC-Frameworks wie AngularJS, allerdings ist die Einarbeitung erheblich aufwendiger.
> Das kannst du machen, wie du es möchtest.
Wieso kommt mir da gerade Fred Brooks prähistorisches Buch in den Sinn?
"The management question, therefore, is not whether to build a pilot
system and throw it away. You will do that. Hence plan to throw one
away; you will, anyhow."
Philipp schrieb: > Möglichkeit 1: > Möglicheit 2: Es kommt halt auch drauf an, wie sich die Seite verhalten soll, bei "Zurück" oder "Favoriten". Eine HTML pro Seite (und nur eine) ist einfach und übersichtlich und wenn deine HTML vor allem Inhalt hat und nicht so viel blinky blinky, dann sind die Seiten auch klein, d.h. laden schneller als irgendwelcher JavaScript-Kram. Daß die HTML-Seiten vom Server generiert werden, so daß nur der Content aus unterschiedlichen Quellen kommt und der Rahmen mit Menü aus weiteren Vorlagen automatisch drumrumgebastelt wird. Da du eh jquery verwendest
1 | <html>
|
2 | <head>
|
3 | <script src="jquery.js"></script> |
4 | <script>
|
5 | $(function(){ |
6 | $("#includedContent").load("b.html"); |
7 | });
|
8 | </script>
|
9 | </head>
|
10 | |
11 | <body>
|
12 | <div id="includedContent"></div> |
13 | </body>
|
14 | </html>
|
Ich werde wohl eine Mischung aus den Vorschlägen machen. Zum übersichtlichen Bearbeiten der paar Seiten werde ich diese aufteilen und dann in divs laden. Und zwar alle und die nicht benötigten Dinge einfach ausblenden. Damit ist bei der Navigation durch die Anwendung keine Interaktion mit dem Server erforderlich. Und darüberhinaus kann der JS Code dann auch Felder aktualisieren, die zur Zeit nicht angezeigt werden (es wird einiges mit long polling aktuell gehalten).
Das kommt jetzt etwas spät, aber hier kommt mein favorisierter Ansatz: 1) Die Hauptseite enthält kopf-, körper- und fussbereich, eventuell auch contauner für Menus. 2) Das Server liefert unter jeder Adresse diese Seite, immer mit dem selben E-Tag damit diese gecached wird. 3) Ein javascript fängt alle clicks ab und ruft eine funktion goToPage auf, welche bei bedarf pushState aufruft um die Url zu ändern ohne die Seite neu zu laden, und läd dan denn neuen Inhalt mit einem AJAX Request 4) Das popstate event abfangen und bei diesem die goToPage funktion aufrufen. 5) Beim verarbeiten des neuen Seiteninhalts templateing anwenden, script tags herausfischen und mit (new Function("env","script",code))(env,script) vor dem einfügen in die Seite ausführen, oder vor dem templateing. 6) Ein Restinterface in den Server einbauen, um z.B. die Seite mit der richtigen Sprache zu laden. 7) Einen noscript tag einbauen und diesen auf eine Javascripfreie version weiterleiten lassen, welche serverseitiges templating umsetzt. 8) Websockets und livesynchronisation einbauen. 9) Application cache für Offlinebetrieb einbauen (der schwierigste punkt) 10) Den Konamicode und andere Spielereien sowie versteckte Seiten einbauen. 11) Seite mit google speed insights optimieren 12) scripts mit dem google closure compiler verkleinern 13) Sich über das nicht funktionierende Indexing der Suchmaschienen ärgern 14) Nächste Seite schreiben
JQuerry und Ajax sind zwar allgemeiner Standard für "normale" Webseiten, für "intern" laufende Anwendungen jedoch wie z.B. Steuerungen oder technische Visualisierung nach meinen Erfahrungen keine besonders gute Idee: Entweder braucht diese Anwendung dann zusätzlich eine Internetverbindung, um die Libs zu includieren (Sicherheitsproblem bzw. generell ein Problem, wenn kein Internet zur Verfügung steht) ... Oder man muss das ganze Zeugs auf den eigenen Server runterladen und von dort holt sich das jeder Client immer wieder neu, was auch nicht so prickelnd ist. Ganz nebenbei ist es geradezu eine Wissenschft, wirklich komplette Offline-Versionen zu finden ...
Philipp schrieb: > Meine Frage ist nun: Wie baut man so etwas heutzutage schlau auf? Mit einem CMS... Ganz ernsthaft, da wird es welche geben, die auch für einen Raspi leicht genug daherkommen, und die nehmen dir die ganzen Detailfragen ab. 2 Sekunden googlen fand z.B. Pico, welches nicht mal eine DB braucht (keine Ahnung, ob ein Raspi mit mysql klarkommt...). Oliver
Hallo, mittlerweile ist es soweit, dass ich es nicht mehr umwerfen will. Es geht dabei um eine Zeitnahmesoftware für den Auto-Rally-Sport (hatte hier diesbezüglich schon eine andere Frage zu MySQL (Zeiten der Uhr)). Das ganze muss Offline laufen, weil bei den Veranstaltungen normalerweise kein Internet vorhanden ist und selbst wenn, dann wird es nicht mit dem Zeitnahme Netz verbunden. (Habe jquery UI also mit auf den Server gelegt) Server ist ein Raspberry Pi an den auch die Uhr angeschlossen wird. Die Clients sind immer diverse Notebooks die von den Helfern mitgebracht werden. Darum das Ganze als Webanwendung, um nichts auf den Clients installieren zu müssen. Die Geräte sind also immer recht aktuell, so dass ich einfach JavaScript vorraussetze. Ein CMS ist denke ich übertrieben, weil es sich bei den zu wählenden Seiten nur um einige Konfigurationsseiten, die Editierung der Fahrerdatenbank sowie die Zeitauswertung handelt. Diese Seiten werden vom Inhalt also praktisch nie geändert. Die Clients laden die Seite eigentlich nur einmal am Tag und bleiben dann dort. Zudem sind es maximal 10. Es sollte also völlig egal sein, das jedes mal jQuery geladen wird. Die größte Last wird denke ich der Live Zeiten Monitor darstellen. Hier wird per long polling alle 100ms (das geschieht in PHP auf dem Server) geschaut ob es neue Daten gibt. Sobald dies der Fall ist werden die Zeiten per JSON auf die Clients an großen Fernsehern geschickt. Das Polling an sich ist nicht das Problem. Es ist eher das Query, dass die Auswertung erstellt. Vielen Dank für Eure Unterstützung
Frank E. schrieb: > Oder man muss das ganze Zeugs auf den eigenen Server runterladen und von > dort holt sich das jeder Client immer wieder neu, was auch nicht so > prickelnd ist. Ganz nebenbei ist es geradezu eine Wissenschft, wirklich > komplette Offline-Versionen zu finden ... ...kennste bower?
Dirk D. schrieb: > ...kennste bower? Nein, werd ich mir aber mal ansehen. Es sieht aber so aus, als müsste ich vorher noch wissen was genau node.js tut :)
Philipp schrieb: > Dirk D. schrieb: >> ...kennste bower? > > Nein, werd ich mir aber mal ansehen. Es sieht aber so aus, als müsste > ich vorher noch wissen was genau node.js tut :) Ne, das musst du nicht wirklich wissen. du musst ja auch nicht wissen was C tut um ne bash zu bedienen :) Bower ist einfach ein paket-manager für web-frontent-pakete, zufällig ist der in nodejs implementiert, es wäre aber egal wenn es in c, perl oder was weiß ich implementiert wäre.
Bitte melde dich an um einen Beitrag zu schreiben. Anmeldung ist kostenlos und dauert nur eine Minute.
Bestehender Account
Schon ein Account bei Google/GoogleMail? Keine Anmeldung erforderlich!
Mit Google-Account einloggen
Mit Google-Account einloggen
Noch kein Account? Hier anmelden.