SlideShare una empresa de Scribd logo
1 de 44
Descargar para leer sin conexión
WER BIN ICH?
• Sebastian Springer	

• https://github.com/sspringer82	

• @basti_springer	

• Consultant,Trainer,Autor
Warum erzähle ich euch
das?
• Wir schlagen uns schon länger mit
Webapplikationen herum
• Wir haben es schon mal falsch gemacht,
deswegen sollt ihr es nicht auch verkehrt machen
Webapplikationen?
vs
einfache Webseiten
mit wenig Interaktion
geocities? anyone?
Umfangreiche Webapplikationen
Verhalten sich wie Applikationen
z.B. cloud9IDE
Webapplikationen
• Multi-User-Systeme
• Benutzer interagiert mit der Anwendung
• Daten werden persistiert
• Browser als Laufzeitumgebung
• Logik auf Client und Server
Die schöne heile Welt?
1. Auswahl
Dieter Schütz / pixelio.de
Sprachen, Frameworks
Entwicklungsumgebungen
Auswahl
• Es gibt nicht die eine richtige Sprache
• Die gewählte Technologie sollte sich für die Lösung
eignen
• Erfahrung im Umgang mit der Technologie
• Evaluation
Webentwicklung, kein
Glaubenskrieg
pepsprog / pixelio.de
2. Software von der
Stange?
lichtkunst.73 / pixelio.de
Frameworks
!
• Nicht für jede Aufgabe das Rad neu erfinden
• Frameworks lösen die meisten Standardprobleme
• Vorteil: Bugfixes, Support, Community
• Die meisten Webframeworks sind Open Source
Frameworks und Tools
3. Ressourcen?
Kurt Michel / pixelio.de
Ressourcen?
• Eine der wichtigsten Ressourcen: Bandbreite
• Die Zeiten von Modems und ISDN sind vorbei?
• Geschwindigkeitsdrosselung bei Mobilgeräten
• Kunden in Strukturschwachen Gebieten
• Rechenkapazität auf den Client-Geräten
Ressourcen
• Minifizierung von HTML, CSS, JavaScript
• CSS Sprites
• Gezippte Kommunikation zwischen Client und
Server
4. Qualitätssicherung
uygar sanli / pixelio.de
Qualitätssicherung?
• Qualität der Software
• Fehler möglichst früh erkennen
• Umgang mit sensiblen Daten
• Kritische Transaktionen
• Features, die Umsatz für das Unternehmen
bedeuten
Qualitätssicherung
• Manuelle Testpläne
• Automatisierte Tests
• Unittests
• Statische- und dynamische Codeanalyse
• Metriken
• Der richtige Grad zwischen Kosten und Nutzen
Continuous Inspection
& Integration
5. Umgebung
berggeist007 / pixelio.de
Umgebung
• Die Serverkomponente ist unter unserer Kontrolle
• Die Clientkomponente nicht
• Unterschiedliche Systeme, Browser, Auflösungen
Feature Detection vs
Browser Sniffing
Modernizr
• Prüft, ob ein Feature existiert
• Option, zusätzliche Dateien zu laden
• Polyfills - ersetzen natives Verhalten durch
Alternativen
6. Aktualisierung der
Daten
Tim Reckmann / pixelio.de
Aktualisierung der Daten
• Webapplikationen sind sehr dynamisch
• Viele Benutzer generieren Daten
• Anzeige der Daten soll möglichst aktuell sein
• HTTP als Protokoll sieht vor allem unidirektionale
Kommunikation vor
Aktualisierung der Daten
• Bidirektionale Kommunikation
• Verschiedene Lösungen: Long Polling,
Websockets, etc.
• Strategien zur Aktualisierung: Request for Reload,
Nutzdaten übermitteln
• Sichere Verbindung über https und wss
7. Releases
Rainer Sturm / pixelio.de
Releases
• Die Zeiten von Releasezyklen von einem Jahr und
mehr sind vorbei
• Neue Features/Bugfixes müssen schnell auf den
Markt
• Viele Unternehmen releasen täglich oder
wöchentlich
• Ein Fehler beim Kunden, der innerhalb von 5
Minuten behoben ist, ist OK
Wie machen die das
denn?
Releases
• Agile Entwicklung
• Feature-Toggles
• Multi-Varianten Testing
• Sehr viel messen
• Roll-Back-Strategien
8. Performance
Thomas Siepmann / pixelio.de
Performance
• Benutzer warten nicht gerne
• Wenn Benutzer warten müssen, muss man ihnen
das sagen
• Graceful degrade - es fällt nur das weg, was nicht
geht
• Keine weißen Seiten, niemals!
Performance
• Profiling - wo geht die Performance verloren
• Priorisierte Performanceverbesserungen - die
Cheap Wins zuerst
• Rückmeldungen wie Loading Indicators
• Performance ist Responsibilität - Hardware ist billig
9. Erweiterbarkeit
Bernd Kasper / pixelio.de
Erweiterbarkeit
• In den seltensten Fällen ist eine Webapplikation
wirklich fertig
• Neue Features müssen integriert werden
• Erweiterung muss kostengünstig erfolgen
Nicht erweiterbar === tot
Erweiterbarkeit
• Modularer Aufbau
• Lose Kopplung
• Verwendung Schnittstellen
• Keep it Simple
10. Rewrite?
Lupo / pixelio.de
Rewrite
• Lebenserwartung einer durchschnittlichen
Webapplikation: ca. 5 Jahre
• Lebenserwartung von Frameworkversionen: 2 Jahre
• Ab einem bestimmten Zeitpunkt wird der Betrieb
einer Software teuer
• Rewrite oder doch lieber Modernisierung
• 96% aller Rewrite-Projekte laufen aus Time & Budget
Rewrite
• Kompletter Rewrite mit hohem Risiko
• Modulweiser Rewrite und Parallelbetrieb
• Kontinuierliche Modernisierung von Anfang an
Fragen
Angela Parszyk / pixelio.de
KONTAKT
Sebastian Springer
sebastian.springer@mayflower.de
!
Mayflower GmbH
Mannhardtstr. 6
80538 München
Deutschland
!
@basti_springer
!
https://github.com/sspringer82

Más contenido relacionado

La actualidad más candente

La actualidad más candente (9)

Responsive Webdesign in a Nutshell - webinale 2015
Responsive Webdesign in a Nutshell - webinale 2015Responsive Webdesign in a Nutshell - webinale 2015
Responsive Webdesign in a Nutshell - webinale 2015
 
Client side webdevelopment with jet
Client side webdevelopment with jetClient side webdevelopment with jet
Client side webdevelopment with jet
 
Digitale Mobilmachung - Wege zum mobilen Internetangebot
Digitale Mobilmachung - Wege zum mobilen Internetangebot Digitale Mobilmachung - Wege zum mobilen Internetangebot
Digitale Mobilmachung - Wege zum mobilen Internetangebot
 
Selfpublishing und Barrierefreiheit - eine Odyssee?!
Selfpublishing und Barrierefreiheit - eine Odyssee?!Selfpublishing und Barrierefreiheit - eine Odyssee?!
Selfpublishing und Barrierefreiheit - eine Odyssee?!
 
FahrvergnÜgen ohne Handbremse! IE ist Tot - lang lebe das Web
FahrvergnÜgen ohne Handbremse! IE ist Tot - lang lebe das WebFahrvergnÜgen ohne Handbremse! IE ist Tot - lang lebe das Web
FahrvergnÜgen ohne Handbremse! IE ist Tot - lang lebe das Web
 
Workspaces in TYPO3
Workspaces in TYPO3Workspaces in TYPO3
Workspaces in TYPO3
 
Mediengerechtes Webdesign
Mediengerechtes WebdesignMediengerechtes Webdesign
Mediengerechtes Webdesign
 
Continuous Delivery praktisch
Continuous Delivery praktischContinuous Delivery praktisch
Continuous Delivery praktisch
 
Development in der Cloud-Ära
Development in der Cloud-ÄraDevelopment in der Cloud-Ära
Development in der Cloud-Ära
 

Destacado

Daniela katzenberger
Daniela katzenbergerDaniela katzenberger
Daniela katzenberger
phillippwild
 
Vier Mädchen, vier Stile
Vier Mädchen, vier StileVier Mädchen, vier Stile
Vier Mädchen, vier Stile
alemangarachico
 
140 Jahre FF Konzell
140 Jahre FF Konzell140 Jahre FF Konzell
140 Jahre FF Konzell
aswebhost
 
Presentation1
Presentation1Presentation1
Presentation1
JanSeder
 
GerüChte In Der Bild
GerüChte In Der BildGerüChte In Der Bild
GerüChte In Der Bild
_isa_
 
Pr damian gola musik
Pr damian gola musikPr damian gola musik
Pr damian gola musik
Ewa Kowalska
 
Musik - Małgorzata Baranowska
Musik - Małgorzata BaranowskaMusik - Małgorzata Baranowska
Musik - Małgorzata Baranowska
Ewa Kowalska
 

Destacado (20)

5 Jahre DRIFT
5 Jahre DRIFT5 Jahre DRIFT
5 Jahre DRIFT
 
15 Dinge, die man statt einer 18.000€ Apple Watch kaufen kann (DE)
15 Dinge, die man statt einer 18.000€ Apple Watch kaufen kann (DE)15 Dinge, die man statt einer 18.000€ Apple Watch kaufen kann (DE)
15 Dinge, die man statt einer 18.000€ Apple Watch kaufen kann (DE)
 
Daniela katzenberger
Daniela katzenbergerDaniela katzenberger
Daniela katzenberger
 
100 Jahre Bernsdorfer
100 Jahre Bernsdorfer100 Jahre Bernsdorfer
100 Jahre Bernsdorfer
 
Gott
GottGott
Gott
 
Vier Mädchen, vier Stile
Vier Mädchen, vier StileVier Mädchen, vier Stile
Vier Mädchen, vier Stile
 
10 Jahre ALTERAktiv Siegen-Wittgenstein e.V.
10 Jahre ALTERAktiv Siegen-Wittgenstein e.V.10 Jahre ALTERAktiv Siegen-Wittgenstein e.V.
10 Jahre ALTERAktiv Siegen-Wittgenstein e.V.
 
10 Jahre GNTM
10 Jahre GNTM10 Jahre GNTM
10 Jahre GNTM
 
Fitness
FitnessFitness
Fitness
 
Star TV Basispräsentation 2014
Star TV Basispräsentation 2014Star TV Basispräsentation 2014
Star TV Basispräsentation 2014
 
F.A.Z. - EditorsLab project
F.A.Z. - EditorsLab projectF.A.Z. - EditorsLab project
F.A.Z. - EditorsLab project
 
Kernphysik
KernphysikKernphysik
Kernphysik
 
Tschechisches Weihnachtslied
Tschechisches WeihnachtsliedTschechisches Weihnachtslied
Tschechisches Weihnachtslied
 
140 Jahre FF Konzell
140 Jahre FF Konzell140 Jahre FF Konzell
140 Jahre FF Konzell
 
Presentation1
Presentation1Presentation1
Presentation1
 
Haarschmuck für Braut und Hochzeit | Brautschmuck.org
Haarschmuck für Braut und Hochzeit | Brautschmuck.orgHaarschmuck für Braut und Hochzeit | Brautschmuck.org
Haarschmuck für Braut und Hochzeit | Brautschmuck.org
 
GerüChte In Der Bild
GerüChte In Der BildGerüChte In Der Bild
GerüChte In Der Bild
 
Pr damian gola musik
Pr damian gola musikPr damian gola musik
Pr damian gola musik
 
Musik - Małgorzata Baranowska
Musik - Małgorzata BaranowskaMusik - Małgorzata Baranowska
Musik - Małgorzata Baranowska
 
Games in Bavaria
Games in BavariaGames in Bavaria
Games in Bavaria
 

Similar a 10 Dinge die ich an dir hasse - Stolpersteine in der Webentwicklung

AG Softwaretechnik
AG SoftwaretechnikAG Softwaretechnik
AG Softwaretechnik
Roland M
 
Eine praktische Anleitung zur Auswahl eines CMS
Eine praktische Anleitung zur Auswahl eines CMSEine praktische Anleitung zur Auswahl eines CMS
Eine praktische Anleitung zur Auswahl eines CMS
Acquia
 
Netd@ys 08/09 Workshop - "Von der kreativen Idee zum innovativen Projekt"
Netd@ys 08/09 Workshop - "Von der kreativen Idee zum innovativen Projekt"Netd@ys 08/09 Workshop - "Von der kreativen Idee zum innovativen Projekt"
Netd@ys 08/09 Workshop - "Von der kreativen Idee zum innovativen Projekt"
Stephan Hamberger
 
Mojo, Twitter und Konsorten
Mojo, Twitter und KonsortenMojo, Twitter und Konsorten
Mojo, Twitter und Konsorten
Philipp Naderer
 
Ueberlegungen Projektmanagement Web Applications
Ueberlegungen Projektmanagement Web ApplicationsUeberlegungen Projektmanagement Web Applications
Ueberlegungen Projektmanagement Web Applications
Günther Haslbeck
 

Similar a 10 Dinge die ich an dir hasse - Stolpersteine in der Webentwicklung (20)

SharePointCommunity.ch SharePoint Lösungen für die Zukunft
SharePointCommunity.ch SharePoint Lösungen für die ZukunftSharePointCommunity.ch SharePoint Lösungen für die Zukunft
SharePointCommunity.ch SharePoint Lösungen für die Zukunft
 
AG Softwaretechnik
AG SoftwaretechnikAG Softwaretechnik
AG Softwaretechnik
 
Responsive Mit Irhem Webseiten (German Edition)
Responsive Mit Irhem Webseiten (German Edition)Responsive Mit Irhem Webseiten (German Edition)
Responsive Mit Irhem Webseiten (German Edition)
 
DACHNUG50 Erfolgreiche Digitalisierung Notes Anwendungen mit Low Code L”sung ...
DACHNUG50 Erfolgreiche Digitalisierung Notes Anwendungen mit Low Code L”sung ...DACHNUG50 Erfolgreiche Digitalisierung Notes Anwendungen mit Low Code L”sung ...
DACHNUG50 Erfolgreiche Digitalisierung Notes Anwendungen mit Low Code L”sung ...
 
Eine praktische Anleitung zur Auswahl eines CMS
Eine praktische Anleitung zur Auswahl eines CMSEine praktische Anleitung zur Auswahl eines CMS
Eine praktische Anleitung zur Auswahl eines CMS
 
Netd@ys 08/09 Workshop - "Von der kreativen Idee zum innovativen Projekt"
Netd@ys 08/09 Workshop - "Von der kreativen Idee zum innovativen Projekt"Netd@ys 08/09 Workshop - "Von der kreativen Idee zum innovativen Projekt"
Netd@ys 08/09 Workshop - "Von der kreativen Idee zum innovativen Projekt"
 
Robuste Design Systems mit Storybook und Angular: vom Konzept zur lebendigen ...
Robuste Design Systems mit Storybook und Angular: vom Konzept zur lebendigen ...Robuste Design Systems mit Storybook und Angular: vom Konzept zur lebendigen ...
Robuste Design Systems mit Storybook und Angular: vom Konzept zur lebendigen ...
 
Plone im Kontext des WCMS Marktes
Plone im Kontext des WCMS MarktesPlone im Kontext des WCMS Marktes
Plone im Kontext des WCMS Marktes
 
Die Strategische Bedeutung Von Open Source FüR Das 3 D Internet V2
Die Strategische Bedeutung Von Open Source FüR Das 3 D Internet V2Die Strategische Bedeutung Von Open Source FüR Das 3 D Internet V2
Die Strategische Bedeutung Von Open Source FüR Das 3 D Internet V2
 
Mojo, Twitter und Konsorten
Mojo, Twitter und KonsortenMojo, Twitter und Konsorten
Mojo, Twitter und Konsorten
 
Cloud-Native experience mit einer Container-Plattform im eigenen Rechenzentrum
Cloud-Native experience mit einer Container-Plattform im eigenen RechenzentrumCloud-Native experience mit einer Container-Plattform im eigenen Rechenzentrum
Cloud-Native experience mit einer Container-Plattform im eigenen Rechenzentrum
 
Modern Lightweight Enterprise Architectures mit Java
Modern Lightweight Enterprise Architectures mit JavaModern Lightweight Enterprise Architectures mit Java
Modern Lightweight Enterprise Architectures mit Java
 
Responsive Web Design - Ein Überblick
Responsive Web Design - Ein ÜberblickResponsive Web Design - Ein Überblick
Responsive Web Design - Ein Überblick
 
Ueberlegungen Projektmanagement Web Applications
Ueberlegungen Projektmanagement Web ApplicationsUeberlegungen Projektmanagement Web Applications
Ueberlegungen Projektmanagement Web Applications
 
Morning Session: Qualitätskriterien für erfolgreiche Websites - für "Nicht-Te...
Morning Session: Qualitätskriterien für erfolgreiche Websites - für "Nicht-Te...Morning Session: Qualitätskriterien für erfolgreiche Websites - für "Nicht-Te...
Morning Session: Qualitätskriterien für erfolgreiche Websites - für "Nicht-Te...
 
Webanalyse-Methoden zur Optimierung von Onlinehilfe
Webanalyse-Methoden zur Optimierung von OnlinehilfeWebanalyse-Methoden zur Optimierung von Onlinehilfe
Webanalyse-Methoden zur Optimierung von Onlinehilfe
 
Continuous Integration / Deployment mit Jenkins CI
Continuous Integration / Deployment mit Jenkins CI Continuous Integration / Deployment mit Jenkins CI
Continuous Integration / Deployment mit Jenkins CI
 
Der Umstieg auf Alma - Einblicke und Ausblicke
Der Umstieg auf Alma - Einblicke und AusblickeDer Umstieg auf Alma - Einblicke und Ausblicke
Der Umstieg auf Alma - Einblicke und Ausblicke
 
Warum gerade TYPO3?
Warum gerade TYPO3?Warum gerade TYPO3?
Warum gerade TYPO3?
 
Graphing mit Graphite (Webinar vom 06.11.2013)
Graphing mit Graphite (Webinar vom 06.11.2013)Graphing mit Graphite (Webinar vom 06.11.2013)
Graphing mit Graphite (Webinar vom 06.11.2013)
 

Más de Sebastian Springer

Más de Sebastian Springer (20)

Schnelleinstieg in Angular
Schnelleinstieg in AngularSchnelleinstieg in Angular
Schnelleinstieg in Angular
 
Creating Enterprise Web Applications with Node.js
Creating Enterprise Web Applications with Node.jsCreating Enterprise Web Applications with Node.js
Creating Enterprise Web Applications with Node.js
 
Divide and Conquer – Microservices with Node.js
Divide and Conquer – Microservices with Node.jsDivide and Conquer – Microservices with Node.js
Divide and Conquer – Microservices with Node.js
 
From Zero to Hero – Web Performance
From Zero to Hero – Web PerformanceFrom Zero to Hero – Web Performance
From Zero to Hero – Web Performance
 
Von 0 auf 100 - Performance im Web
Von 0 auf 100 - Performance im WebVon 0 auf 100 - Performance im Web
Von 0 auf 100 - Performance im Web
 
A/B Testing mit Node.js
A/B Testing mit Node.jsA/B Testing mit Node.js
A/B Testing mit Node.js
 
Angular2
Angular2Angular2
Angular2
 
Einführung in React
Einführung in ReactEinführung in React
Einführung in React
 
JavaScript Performance
JavaScript PerformanceJavaScript Performance
JavaScript Performance
 
ECMAScript 6 im Produktivbetrieb
ECMAScript 6 im ProduktivbetriebECMAScript 6 im Produktivbetrieb
ECMAScript 6 im Produktivbetrieb
 
Streams in Node.js
Streams in Node.jsStreams in Node.js
Streams in Node.js
 
JavaScript Performance
JavaScript PerformanceJavaScript Performance
JavaScript Performance
 
Große Applikationen mit AngularJS
Große Applikationen mit AngularJSGroße Applikationen mit AngularJS
Große Applikationen mit AngularJS
 
Testing tools
Testing toolsTesting tools
Testing tools
 
Node.js Security
Node.js SecurityNode.js Security
Node.js Security
 
Typescript
TypescriptTypescript
Typescript
 
Reactive Programming
Reactive ProgrammingReactive Programming
Reactive Programming
 
Best Practices für TDD in JavaScript
Best Practices für TDD in JavaScriptBest Practices für TDD in JavaScript
Best Practices für TDD in JavaScript
 
Warum ECMAScript 6 die Welt ein Stückchen besser macht
Warum ECMAScript 6 die Welt ein Stückchen besser machtWarum ECMAScript 6 die Welt ein Stückchen besser macht
Warum ECMAScript 6 die Welt ein Stückchen besser macht
 
Lean Startup mit JavaScript
Lean Startup mit JavaScriptLean Startup mit JavaScript
Lean Startup mit JavaScript
 

10 Dinge die ich an dir hasse - Stolpersteine in der Webentwicklung