Return of the Fat Client Erwin van der Koogh Co-Founder - - PowerPoint PPT Presentation

▶
return of the fat client
SMART_READER_LITE
LIVE PREVIEW

Return of the Fat Client Erwin van der Koogh Co-Founder - - PowerPoint PPT Presentation

Feb 23, 2023 229 likes •870 views

Return of the Fat Client Erwin van der Koogh Co-Founder Bitgenics/Linc WE AUTOMATE, YOU ITERATE Return of the Fat Client An unlikely band of front-end developers has banded together. This Rebel Alliance is a collection of inter-connected

slide-1
SLIDE 1

Erwin van der Koogh Co-Founder Bitgenics/Linc

WE AUTOMATE, YOU ITERATE

Return of the Fat Client

slide-2
SLIDE 2

An unlikely band of front-end developers has banded together. This Rebel Alliance is a collection of inter-connected tribes

  • riginally started by Master Resig on his homeworld JQuery.

After a string of recent success the Rebels are feeling cocky

WE AUTOMATE, YOU ITERATE

Return of the Fat Client

slide-3
SLIDE 3

WE AUTOMATE, YOU ITERATE

DISCLAIMER!

slide-4
SLIDE 4

WE AUTOMATE, YOU ITERATE

slide-5
SLIDE 5

WE AUTOMATE, YOU ITERATE

slide-6
SLIDE 6

WE AUTOMATE, YOU ITERATE

Quantum Leap through computer history

slide-7
SLIDE 7

WE AUTOMATE, YOU ITERATE

1949

Grace Hopper

slide-8
SLIDE 8

WE AUTOMATE, YOU ITERATE

Mainframes thin clients

slide-9
SLIDE 9

WE AUTOMATE, YOU ITERATE

1979

Adele Goldberg

slide-10
SLIDE 10

WE AUTOMATE, YOU ITERATE

Client - Server thick clients

slide-11
SLIDE 11

WE AUTOMATE, YOU ITERATE

1985

Radia Perlman

slide-12
SLIDE 12

WE AUTOMATE, YOU ITERATE

Web Apps thin clients

slide-13
SLIDE 13

WE AUTOMATE, YOU ITERATE

1942

Hedy Lamarr

slide-14
SLIDE 14

WE AUTOMATE, YOU ITERATE

Mobile Apps thick clients

slide-15
SLIDE 15

WE AUTOMATE, YOU ITERATE

2015

Sophie Alpert

slide-16
SLIDE 16

WE AUTOMATE, YOU ITERATE

Front-end Apps thick clients

slide-17
SLIDE 17

WE AUTOMATE, YOU ITERATE

Wax on, wax off?

slide-18
SLIDE 18

WE AUTOMATE, YOU ITERATE

Ease of Management Richness/Responsiveness

slide-19
SLIDE 19

WE AUTOMATE, YOU ITERATE

Mainframes

Ease of Management Richness/Responsiveness

slide-20
SLIDE 20

WE AUTOMATE, YOU ITERATE

Client/Server Mainframes

Ease of Management Richness/Responsiveness

slide-21
SLIDE 21

WE AUTOMATE, YOU ITERATE

Client/Server Web Applications Mainframes

Ease of Management Richness/Responsiveness

slide-22
SLIDE 22

WE AUTOMATE, YOU ITERATE

Client/Server Mobile Apps Web Applications Mainframes

Ease of Management Richness/Responsiveness

slide-23
SLIDE 23

WE AUTOMATE, YOU ITERATE

Client/Server Mobile Apps Front-end Applications Web Applications Mainframes

Ease of Management Richness/Responsiveness

slide-24
SLIDE 24

WE AUTOMATE, YOU ITERATE

slide-25
SLIDE 25

WE AUTOMATE, YOU ITERATE

slide-26
SLIDE 26

WE AUTOMATE, YOU ITERATE

COWABUNGA!

slide-27
SLIDE 27

WE AUTOMATE, YOU ITERATE

Let’s gaze in our Dark Crystal.. shard?

slide-28
SLIDE 28

WE AUTOMATE, YOU ITERATE

slide-29
SLIDE 29

WE AUTOMATE, YOU ITERATE

Performance

slide-30
SLIDE 30

WE AUTOMATE, YOU ITERATE

slide-31
SLIDE 31

WE AUTOMATE, YOU ITERATE

slide-32
SLIDE 32

WE AUTOMATE, YOU ITERATE

https://medium.com/@addyosmani/the-cost-of-javascript- in-2018-7d8950fbb5d4

Cost of JS in 2018

Addy Osmani

slide-33
SLIDE 33

WE AUTOMATE, YOU ITERATE

The BBC found they lost an additional 10% of users for every additional second their site took to load. DoubleClick found 53% of mobile site visits were abandoned if a page took longer than 3 seconds.

slide-34
SLIDE 34

WE AUTOMATE, YOU ITERATE

Deploying

slide-35
SLIDE 35

WE AUTOMATE, YOU ITERATE

Having a bundle per environment is unforgivable

slide-36
SLIDE 36

WE AUTOMATE, YOU ITERATE

slide-37
SLIDE 37

WE AUTOMATE, YOU ITERATE

my-app-2.3.1-ab49fc1-prod-min.js my-app-2.3.1-b73cd42-staging-min.js

Spot the differences

slide-38
SLIDE 38

WE AUTOMATE, YOU ITERATE

Crawling

slide-39
SLIDE 39

WE AUTOMATE, YOU ITERATE

But Erwin, Google indexes JS!

slide-40
SLIDE 40

WE AUTOMATE, YOU ITERATE

Yes.. (ish) But..

slide-41
SLIDE 41

WE AUTOMATE, YOU ITERATE

HTML is still the king

slide-42
SLIDE 42

WE AUTOMATE, YOU ITERATE

slide-43
SLIDE 43

WE AUTOMATE, YOU ITERATE

Final Frontier

slide-44
SLIDE 44

WE AUTOMATE, YOU ITERATE

#NotJustCSR #NoCSR #ServerfulCSR

slide-45
SLIDE 45

WE AUTOMATE, YOU ITERATE

Power of 3

Production-worthy Performance Personalisation

slide-46
SLIDE 46

WE AUTOMATE, YOU ITERATE

Production-worthy

1 Bundle through a pipeline Canary deployments & AB Test Security Headers Crawleable

slide-47
SLIDE 47

WE AUTOMATE, YOU ITERATE

Performance

Caching Headers Chunking/Preload Headers Server-Side Rendering

slide-48
SLIDE 48

WE AUTOMATE, YOU ITERATE

Personalisation

Location Language User-Agent Cookies

slide-49
SLIDE 49

WE AUTOMATE, YOU ITERATE

slide-50
SLIDE 50

WE AUTOMATE, YOU ITERATE

Introducing Front-end Application Bundles

slide-51
SLIDE 51

WE AUTOMATE, YOU ITERATE

Front-end Tooling FAB Hosting Runtimes

slide-52
SLIDE 52

WE AUTOMATE, YOU ITERATE

slide-53
SLIDE 53

WE AUTOMATE, YOU ITERATE

Static Server

linc-sh-a8db4f.fab

slide-54
SLIDE 54

WE AUTOMATE, YOU ITERATE

Static

/_assets/*

slide-55
SLIDE 55

WE AUTOMATE, YOU ITERATE

Static Server

linc-sh-a8db4f.fab

slide-56
SLIDE 56

WE AUTOMATE, YOU ITERATE

Server

slide-57
SLIDE 57

WE AUTOMATE, YOU ITERATE

STOP , DEMO TIME!

slide-58
SLIDE 58

WE AUTOMATE, YOU ITERATE

Local Development

slide-59
SLIDE 59

WE AUTOMATE, YOU ITERATE

Preview Links

slide-60
SLIDE 60

WE AUTOMATE, YOU ITERATE

Cloudflare Workers

slide-61
SLIDE 61

WE AUTOMATE, YOU ITERATE ?

slide-62
SLIDE 62

Sign up for closed beta invite of Linc at linc.sh

WE AUTOMATE, YOU ITERATE