Inosoft
JavaScript UI-Frameworks in HMIs
JavaScript UI-Frameworks gibt es wie Sand am Meer. Welche gibt es und wie passen sie zu industriellen HMI-Anwendungen? Können Mitarbeiter*innen sie technisch betreuen? Und warum sollten Anwender darauf achten, wer hinter den Frameworks steckt?
Die wachsende Digitalisierung von Prozessen führt dazu, dass IT und OT ihre Grenzen überwinden und zusammenwachsen. Technologien, die im IT-Umfeld bereits seit vielen Jahren etabliert sind, ziehen hierdurch auch in die OT-Welt ein. Der Vormarsch von Ethernet-Netzwerken und TCP-basierten Kommunikationsprotokollen oder auch die Nutzung von Industrie-PCs als Automatisierungsplattform sind nur einige Beispiele hierfür. Vor allem die Einbeziehung des Internets sorgt dafür, dass weitere, in der IT seit Jahren etablierte Technologien auch in industriellen Anwendungen einziehen. Ein gutes Beispiel hierfür sind HTML5-basierte Benutzerschnittstellen (Bild 1) – diese können ohne weitere Installation mit nahezu beliebigen Endgeräten völlig ortsunabhängig mit einem Webbrowser genutzt werden. Die offensichtlichen Vorteile dieser Technologie haben viele Maschinenbauer dazu veranlasst, auch das lokale HMI einer Maschine auf diese Technologie aufzusetzen.
Frameworks erleichtern die Arbeit
Nur mit Hilfe von HTML allein lässt sich allerdings noch keine moderne Benutzerschnittstelle (User Intefaces, UI) gestalten, wie der Anwender sie erwartet. Hierfür sind weitere Technologien wie die Programmiersprache JavaScript und die Gestaltungs- und Formatierungssprache CSS notwendig. Da quasi alle modernen Webbrowser sowohl JavaScript als auch CSS unterstützen, stellt das kein Problem dar. Die Herausforderung liegt eher im Aufwand, der bei der Umsetzung anfällt. Aus diesem Grund entstehen hierfür immer wieder neue UI-Frameworks auf Basis von JavaScript und CSS. Diese nehmen dem Programmierer viel Arbeit ab, indem sie ein Rahmengerüst und vorgefertigte Komponenten und Funktionen zur Ausgestaltung einer grafischen Benutzeroberfläche bereitstellen. Dazu gehören UI-Elemente wie Schaltflächen oder Ein- und Ausgabefelder aber auch komplexe Layout-Vorlagen und Navigationsfunktionen. Über verschiedene Entwurfsmuster bieten sie bewährte Lösungsschablonen für die Architektur und Entwicklung einer modernen Web-App. Die Liste der verfügbaren JavaScript UI-Frameworks ist lang und wächst stetig. Tabelle 1 gibt einen kleinen Überblick über aktuell populäre Frameworks. Darüber hinaus gibt es neben den vollständigen UI-Frameworks viele weitere Bibliotheken, die sich auf einzelne Funktionen spezialisiert haben (Tabelle 2).
Die Frameworks und Bibliotheken werden in der Regel im Rahmen von Open-Source-Projekten entwickelt. Teilweise stehen große, US-amerikanische Softwarekonzerne wie Google (Angular) oder Meta (React) dahinter, sie setzen die Frameworks auch in eigenen Apps und Plattformen wie Google Gmail oder Facebook ein.
- JavaScript UI-Frameworks in HMIs
- Anforderungen des Maschinenbauers
Das könnte Sie auch interessieren
Hy-Line
Das modulare HMI-Konzept
Phoenix Contact
Renu übernimmt HMI-Fertigung
Inosoft auf der SPS 2022
Responsive Design für HMI
Verwandte Artikel
INOSOFT GmbH
Mit Fokus: Edge & Cloud Computing
Das E-Paper der Ausgabe 03/23
Mit Fokus: Distribution
Das E-Paper der Januar-Ausgabe
Inosoft auf der SPS 2022
Responsive Design für HMI
SPS
Partnerschaft
Wago setzt auf Bosch Rexroth
ABB
20 Mio. US-Dollar für Roboterfabrik in den USA
