Cutting Edge
Web Applications

Hi

Sebastian Stiehl

• JS Developer
• 5 years @ IS24 SL-Search
• Dynamic Frontend Expert

Transformation of the Web

Web Pages

Transformation of the Web

Web Applications

web applications

legacy technology layer

Backend & Frontend

SPA

single page application

SPA

advantages

• improved usability
• distributed load/performance
• less data traffic
• offline support

disadvantages

• security
• browser caching
• memory leaks
• seo

SPA

loading data

SPA

libraries

• helpers
• structure
• shortcuts

SPA

frameworks

• separation of concern
• rendering
• routing
• 2 way data binding

{{slide.title}}

{{slide.topic}}

Backend & Frontend

Backend

deployment chain

CI

Continuous-Integration System

• automate
• transparency
• reports

CI

build the web application

• compile
• combine
• compress
• create artifact

CI

test the code

• check code quality
• run unit tests
• run end to end tests
• run integration tests

CI

deploy the artifact to the servers

• stop services
• place and unpack artifact
• start services

Server

Node.js

• server side js runtime
• event driven
• non-blocking io
• google v8 engine (c++)

SPA Server

flat technology layer

Measure

Measure

backend & frontend errors

• grep logs
• logstash + kibana
• graphite

Measure

performance

• browser dev tools
• webpagetest.org
• RUM

Measure

success

• Google Analytics
• Comscore

Q&A

• sstiehl.io
• twitter @5oc

Thank you!