Diese Präsentation wurde erfolgreich gemeldet.
Wir verwenden Ihre LinkedIn Profilangaben und Informationen zu Ihren Aktivitäten, um Anzeigen zu personalisieren und Ihnen relevantere Inhalte anzuzeigen. Sie können Ihre Anzeigeneinstellungen jederzeit ändern.

Modern Web: Trends der Webentwicklung

43 Aufrufe

Veröffentlicht am

Die Welt rund um das Frontend befindet sich im ständigen Wandel. Die Leistung der Computer der Konsumentinnen und Konsumenten und auch deren Erwartungen an Software steigen. Während die Server von Webdiensten früher lediglich ein wenig HTML erzeugen mussten, liegt die Logik heutzutage deshalb immer mehr auf dem Client, um eine optimale User Experience sicherzustellen – und das bringt Herausforderungen mit.
Im Talk schauten wir uns einige Trends der Webentwicklung an und analysierten die Probleme, die durch das Aufrüsten der Browser durch Google und Co. gelöst werden.

Veröffentlicht in: Software
  • Als Erste(r) kommentieren

  • Gehören Sie zu den Ersten, denen das gefällt!

Modern Web: Trends der Webentwicklung

  1. 1. Lars Kölpin - open knowledge GmbH @LarsKoelpin @_openknowledge #wissenteilen @LarsKoelpin Modern Web
  2. 2. “Any application that can be written in JavaScript, will eventually be written in JavaScript” Jeff Atwood (2007)
  3. 3. 1990 20202005 Nativ
  4. 4. 1990 20202005 Nativ Websites
  5. 5. 1990 20202005 Nativ Websites JSF 1.0 Ruby On Rails
  6. 6. 1990 20202005 Nativ Websites JSF 1.0 Ruby On Rails jQuery JSF 2.0 AngularJS
  7. 7. 1990 20202005 Nativ Websites JSF 1.0 Ruby On Rails jQuery ReactJS Angular 2 VueJSAngularJS JSF 2.0
  8. 8. Klassische Webapplikation • Anzeigen der UI • Speichern der Daten • Validieren der Daten • Rendern der Daten • Transformieren von Daten • Kommunikation von Clients • Sichern von Geschäftslogik $$$
  9. 9. Client an die Macht?? • Anzeigen der UI • (zentrales) Speichern der Daten • Validieren der Daten • Rendern der Daten • Berechnen von Daten • Kommunikation von Clients • (Speichern der Daten) • (Kommunikation von Clients) • Sichern von Geschäftslogik
  10. 10. Der Browser als das neue Backend?
  11. 11. 1990 20202005 Nativ Websites JSF 1.0 Ruby On Rails ReactJS Angular 2 VueJSAngularJS JSF 2.0 WebAssembly 2019
  12. 12. A core use-case for WebAssembly is to take the existing ecosystem of C libraries and allow developers to use them on the web.
  13. 13. info("1") fetch("/users", log("2") info("3") info("1") "1" INSTRUCTIONS STACK BROWSER CONSOLE
  14. 14. fetch("/users", log("2")) info("3") "1" INSTRUCTIONS STACK BROWSER CONSOLE fetch("/users", log("2") fetch("/users", log("2"))
  15. 15. info("3") "1" INSTRUCTIONS STACK BROWSER CONSOLE fetch("/users", log("2")) info("3") "3"
  16. 16. "1" INSTRUCTIONS STACK BROWSER CONSOLE fetch("/users", log("2")) "3" log("2") fetch("/users", log("2")) "2"
  17. 17. while(true) { console.log("ABC") }
  18. 18. Titel der Präsentation | Name des Sprechers
  19. 19. STACK CONSOLE fetch("/users", log("2")) longRunningProcess("3")
  20. 20. STACK CONSOLE fetch("/users", log("2")) longRunningProcess("3")
  21. 21. 1990 20202005 Nativ Websites JSF 1.0 Ruby On Rails ReactJS Angular 2 VueJSAngularJS JSF 2.0 WebAssembly 20192010 WebWorker
  22. 22. Web Workers makes it possible to run a script operation in a background thread separate from the main execution thread of a web application. The advantage of this is that laborious processing can be performed in a separate thread, allowing the main (usually the UI) thread to run without being blocked/slowed down.
  23. 23. 1990 20202005 Nativ Websites JSF 1.0 Ruby On Rails ReactJS Angular 2 VueJSAngularJS JSF 2.0 WebAssembly 20192010 WebWorker ServiceWorker 2015
  24. 24. 1990 20202005 Nativ Websites JSF 1.0 Ruby On Rails ReactJS Angular 2 VueJSAngularJS JSF 2.0 WebAssembly 20192010 WebWorker ServiceWorker 2015 IndexedDB
  25. 25. IndexedDB is a low-level API for client-side storage of significant amounts of structured data, including files/blobs.... This API uses indexes to enable high- performance searches of this data. While WebStorage is useful for storing smaller amounts of data, it is less useful for storing larger amounts of structured data. IndexedDB provides a solution. This is the main landing page for MDN's IndexedDB coverage — here we provide links to the full API reference and usage guides, browser support details, and some explanation of key concepts.
  26. 26. 1990 20202005 Nativ Websites JSF 1.0 Ruby On Rails ReactJS Angular 2 VueJSAngularJS JSF 2.0 WebAssembly 20192010 WebWorker ServiceWorker 2015 IndexedDB WebRTC 2011
  27. 27. Ich will mit Renke reden: Ich bin: Lars Lars? Klar, ich bin: Renke
  28. 28. Du kannst Renke hier erreichen: Renke
  29. 29. 1990 20202005 Nativ Websites (Flash) JSF 1.0 Ruby On Rails Java Applets ReactJS Angular 2 VueJSAngularJS JSF 2.0 WebAssembly 20192010 WebWorker ServiceWorker 2015 IndexedDB WebRTC
  30. 30. “Any application that can be written in JavaScript, will eventually be written in JavaScript”

×