Caching in Angular (Folge 40)

In dieser Episode erfährst du, welchen Nutzen Caching hat und welche Arte von Caching gibt. Und was davon in Angular relevant ist und praktisch einsetzbar ist.

Was ist Caching?

Eine bessere oder zu mindestens eine gleiche Leistung zu bieten und teurere oder knappe Ressource schonen. Um dies zu ermöglichen Nutzen wir günstigere Ressourcen. Teurere Ressourcen sind zurzeit Netzwerk-Traffic und (serverseitige) Rechenleistung. Dagegen ist Speicherplatz günstig.

Arten des Caching

• Serverseitig
• CDN / Auslieferung von Inhalten
• Clientseitig
• innerhalb einer Anwendung

Caching in Angular

Serverseitig ist in Angular eher selten zu finden. Es kann bei der genutzten API oder bei Server-Side-Rendering (Angular Universal) zur Anwendung kommen.

Content-Develivery-Networks (CDN) werden für das schnelle Bereitstellen von statischen Daten wie HTML, JavaScript, CSS und Bilder genutzt. Dabei bekommt der Anwender die Daten von einem Server mit der geringsten Latenz.

Clientseitig können die Daten zwischenzuspeichern werden, um API-Request zu reduzieren und eine Offline-Fähigkeit zu erreichen.

Nachteile

Nachteile von Caching können Dateninkonsistenzen sein. Wichtig ist deshalb, dass die Fragen wie und wann aktualisiere ich die Daten im Cache, geklärt sind. Diese sind abhängig davon, was du mit deiner Anwendung und dein Anwender damit macht.

Nutzerorientiertes Caching

Essenziell ist, dass auch bei Caching von Nutzer ausgedacht wird. Hier sind bei Lesenden-Operationen eine schnelle Reaktion wichtig. Das Bereitstellen aus einem Cache kann deshalb von Vorteil sein. Um Datenabweichung zu reduzieren, kann es sinnvoll sein, die Daten zu aktualisieren oder eine Benachrichtigung anzubieten.

Der Einsatz von Caching bei Schreibenden-Operationen ist eine Versionierung der Daten sinnvoll. Diese Versionierung muss die genutzte API bereitstellen. Dabei kann eine Nummer hochgezählt werden oder ein Datum als Version verwendet werden. Konflikte bei der Versionierung muss dem Benutzer mitgeteilt werden. Der Benutzer entscheidet, wie mit diesen Konflikten fachlich umgegangen wird.

Um in Angular http-Request zwischenzuspeichern, können wir die RxJS Operation shareReplay nutzen.

Du möchtest großartige Angular Anwendungen schreiben? Kennst du die fünf kritischen Elemente, die notwendig sind für eine erfolgreiche Softwareentwicklung mit Angular? Der Angular Coding Blueprint liefert dir nicht nur alle Details zu den fünf Elementen wie Programmieren und Tests, sondern auch den Prozess erfolgreicher Softwareentwicklung. Du kannst dir den Angular Coding Blueprint hier herunterladen:
http://bit.ly/angular-blueprint

Abonniere den Podcast auf iTunes 🎧: http://apple.co/2OlOKQI

Ich freue mich, wenn du dir ein paar Minuten Zeit nimmst und diesen Podcast auf iTunes bewertest.

Xing: http://bit.ly/sd-xing

Facebook: http://bit.ly/angular-facebook