Am Anfang war das World Wide Web eine Sammlung von statischen, festen Seiten mit wenigen Möglichkeiten, den Benutzer mit der Webseite interagieren zu lassen. Das hat sich in den letzten Jahren und Jahrzehnten gründlich geändert und zum größten Teil war dafür die Entwicklung der Programmiersprache JavaScript verantwortlich. Hochdynamische Seiten bis hin zu Spielen waren damit kein Hexenwerk mehr.
Die Geburt von React in den Hallen von Facebook
2011 entwickelte ein findiger Facebook-Programmierer eine Softwarebibliothek für JavaScript, die es ermöglichte, wiederverwendbare Komponenten zu bauen, die schnell und unkompliziert auf Usereingaben und Datenänderungen reagieren. React war geboren.
Grundidee war dabei, dass bei Usereingaben bisher die gesamte aktuell geladene Website neu gerendert werden musste, selbst wenn die neu gerenderte Seite sich nur minimal von der zuvor angezeigten Seite unterschied – React löst dieses Problem durch die Einführung eines sogenannten virtuellen DOM. Statt jedes Mal die gesamte Seite neu zu rendern, erkennt React die Änderungen und entfernt nicht mehr vorhandene Elemente, fügt Neue hinzu oder verändert Bestehende. Facebook selbst benutzte dieses Modell zuerst bei seinem Newsfeed.
Zusätzlich führte React eine Syntaxerweiterung ein, die sogenannte JavaScript Syntax Extension, eine an XML angelehnte Template-Sprache. Sie ähnelt in weiten Teilen klassischem HTML, ermöglicht es aber darüber hinaus, JavaScript Elemente einzubauen.
Die weitere Entwicklung
In den letzten Jahren nahm React Abschied vom klassischen, objektorientierten Ansatz (React Komponenten waren JavaScript Klassen) und adaptierte viele Elemente der funktionalen Programmierung, was zu einer deutlichen Verschlankung und Effektivitätssteigerung der Komponenten führte.
Wichtige Konzepte sind dabei, dass Komponenten selbst Funktionen sind, Daten nicht verändert, sondern neu gebaut werden (Immutability), auf klassisches Eventhandling größtenteils verzichtet wird (und stattdessen mit Callbackfunktionen gearbeitet wird) und wiederverwendbarer Code nicht in Klassen gekapselt, sondern als wiederverwendbare Funktionen in sogenannten Hooks benutzt wird.
Ein Vorteil von React gegenüber anderen UI-Bibliotheken ist, dass durch eine sehr große Anzahl an Zusatzpaketen die gewünschten Funktionalitäten einfach per Installation der entsprechenden Pakete je nach Anforderung der Webapplikation hinzugefügt werden können, was zu einem guten Kompromiss aus Umfang und Nutzbarkeit führt.
Pakete wie mobX oder Redux ermöglichen so z.B. die Entwicklung kompliziertester, asynchron laufender Anwendungen, TypeScript eine präzise Typisierung und unzählige Frontend-Bibliotheken bieten komplexe UI-Elemente, die es einfach und schnell möglich machen, flexible, responsive schnelle und hochdynamische Webanwendungen zu entwickeln.
Wir konnten Ihr Interesse für React wecken? Dann kontaktieren Sie uns sehr gerne. Vielleicht findet diese spannende Technologie ja auch in Ihrem nächsten Projekt Einsatz.