SlideShare a Scribd company logo
BUILDING RESILIENT
FRONTEND SYSTEMS
Ian Feather - BuzzFeed
RESILIENCE IS
FUNCTION
IN A HOSTILE
ENVIRONMENT
HOW CAN OUR
SYSTEMS FAIL?
SECTION 1
3RD PARTY AVAILABILITY
S3
S3
DYN DNS
S3
DYN DNS
CDN
S3
DYN DNS
CDN
S3
3RD PARTY AVAILABILITY
3RD PARTY AVAILABILITY
OUR OWN BUGS
3RD PARTY AVAILABILITY
OUR OWN BUGS
3RD PARTY AVAILABILITY
OUR OWN BUGS
THE NETWORK
1.04%
OF REQUESTS FOR JAVASCRIPT
WILL TIMEOUT
13 MILLION
PAGEVIEWS PER
MONTH
3RD PARTY AVAILABILITY
OUR OWN BUGS
THE NETWORK
3RD PARTY AVAILABILITY
OUR OWN BUGS
THE NETWORK
USERS’ PRIVILEGE
8.9%
OF USERS USE SOME FORM
OF CONTENT BLOCKER
3.84%
WON’T SUCCESSFULLY
DOWNLOAD OUR FONTS
38 MILLION
PAGEVIEWS PER
MONTH
3RD PARTY AVAILABILITY
OUR OWN BUGS
THE NETWORK
USERS’ PRIVILEGE
HOPE FOR
THE BEST
DESIGN FOR
FAILURE
DESIGN FOR
FAILURE
SECTION 2
PRIORITIZE CRITICAL
PARTS OF THE PAGE
User
User
html
User
html
CSS JS IMAGES
User
html
IMAGES
CSS JS IMAGES
User
FONTS
html
IMAGES
CSS JS IMAGES
User
FONTS
html
IMAGES DATA (xhr)
CSS JS IMAGES
User
FONTS
html
IMAGES DATA (xhr)
IMAGES
CSS JS IMAGES
User
FONTS
html
IMAGES DATA (xhr)
IMAGES
CSS JS IMAGES
Images
User
FONTS
html
IMAGES DATA (xhr)
IMAGES
CSS JS IMAGES
HTML
PRIORITIZE CRITICAL
PARTS OF THE PAGE
PRIORITIZE CRITICAL
PARTS OF THE PAGE
MAKE ERRORS A FIRST
CLASS CITIZEN
SOMETHING BROKE.
SHOULD I TELL
THEM?
✘
✘
PRIORITIZE CRITICAL
PARTS OF THE PAGE
MAKE ERRORS A FIRST
CLASS CITIZEN
PRIORITIZE CRITICAL
PARTS OF THE PAGE
MAKE ERRORS A FIRST
CLASS CITIZEN
REPORT YOUR ERRORS
KNOWING IT’S
BROKEN BEFORE
TWITTER DOES
PRIORITIZE CRITICAL
PARTS OF THE PAGE
MAKE ERRORS A FIRST
CLASS CITIZEN
REPORT YOUR ERRORS
MITIGATE
RISK
SECTION 3
BUILD IN
REDUNDANCY
Asset
SERVER 1
Asset
SERVER 1
www.asset-server-one.com/styles.css
Asset
SERVER 1🔥www.asset-server-one.com/styles.css
✖
Asset
SERVER 1🔥www.asset-server-one.com/styles.css
✖
Asset
SERVER 1🔥
Asset
SERVER 2
www.asset-server-one.com/styles.css
✖
Asset
SERVER 1🔥
Asset
SERVER 2
www.asset-server-two.com/styles.css
www.asset-server-one.com/styles.css
✖
Asset
SERVER 1🔥
Asset
SERVER 2
www.asset-server-two.com/styles.css
www.asset-server-one.com/styles.css
Asset
SERVER 1
Asset
SERVER 2
Proxy
service
Asset
SERVER 1
Asset
SERVER 2
www.asset-server.com/styles.css
Proxy
service
Asset
SERVER 1
Asset
SERVER 2
www.asset-server.com/styles.css
Proxy
service
Asset
SERVER 1
Asset
SERVER 2
www.asset-server.com/styles.css
Proxy
service
CLOUD PROVIDER
CDN
STATIC ASSET SERVER
FONT PROVIDER
IMAGE SERVICE
ADS PROVIDER
AB TEST SERVICE
BUILD IN
REDUNDANCY
BUILD IN
REDUNDANCY
SERVE STALE
CONTENT
SERVER
SERVER
CDN
SERVER
CDN
SERVER
CDN
SERVER
CDN
SERVER
🔥
CDN
SERVER
🔥
CDN
CDN
SERVER
CDN
✖
SERVER
CDN
✖
SERVICE WORKER
SERVER
CDN
✖
SERVICE WORKER
SERVER
BUILD IN
REDUNDANCY
SERVE STALE
CONTENT
IN SUMMARY
IN SUMMARY
THANKS
INCREDIBLE

PHOTOGRAPY
VIA UNSPLASH
NeONBRAND - https://unsplash.com/photos/plrlb68XPqI
Marc Liu - https://unsplash.com/photos/Z8epsqHdYeM
Amy Reed - https://unsplash.com/photos/49ZXvCLerUo
Matt Le - https://unsplash.com/photos/SJSpo9hQf7s
White wolf wizard - https://unsplash.com/photos/cttQw_azA40

More Related Content

Similar to Frontend Resilience

Building Global Multi-Region, Active-Active Serverless Backends
Building Global Multi-Region, Active-Active Serverless Backends Building Global Multi-Region, Active-Active Serverless Backends
Building Global Multi-Region, Active-Active Serverless Backends
Amazon Web Services
 
Progressive Web Apps for Education
Progressive Web Apps for EducationProgressive Web Apps for Education
Progressive Web Apps for Education
Chris Love
 
Выявление и локализация проблем в сети с помощью инструментов Riverbed
Выявление и локализация проблем в сети с помощью инструментов RiverbedВыявление и локализация проблем в сети с помощью инструментов Riverbed
Выявление и локализация проблем в сети с помощью инструментов Riverbed
Elena Marianenko
 
KRNIC Data Driven DNS Security
KRNIC Data Driven DNS SecurityKRNIC Data Driven DNS Security
KRNIC Data Driven DNS Security
APNIC
 
Migrating Oracle to Aurora PostgreSQL Utilizing AWS Database Migration Servic...
Migrating Oracle to Aurora PostgreSQL Utilizing AWS Database Migration Servic...Migrating Oracle to Aurora PostgreSQL Utilizing AWS Database Migration Servic...
Migrating Oracle to Aurora PostgreSQL Utilizing AWS Database Migration Servic...
Amazon Web Services
 
Running a Megasite on Microsoft Technologies
Running a Megasite on Microsoft TechnologiesRunning a Megasite on Microsoft Technologies
Running a Megasite on Microsoft Technologies
goodfriday
 
IRJET - Review on Search Engine Optimization
IRJET - Review on Search Engine OptimizationIRJET - Review on Search Engine Optimization
IRJET - Review on Search Engine Optimization
IRJET Journal
 
Catalyze Webcast - Five Myths Of RIA With Laurie Gray - 031808
Catalyze Webcast - Five Myths Of RIA With Laurie Gray - 031808Catalyze Webcast - Five Myths Of RIA With Laurie Gray - 031808
Catalyze Webcast - Five Myths Of RIA With Laurie Gray - 031808
Tom Humbarger
 
Web Performance 101
Web Performance 101Web Performance 101
Web Performance 101
Uri Lavi
 
Presentation to customers sharing flash across virtualized workloads (1)
Presentation to customers   sharing flash across virtualized workloads (1)Presentation to customers   sharing flash across virtualized workloads (1)
Presentation to customers sharing flash across virtualized workloads (1)
WELLNEXT® (formerly Nature's Products, Inc.)
 
Douglas - Real JavaScript
Douglas - Real JavaScriptDouglas - Real JavaScript
Douglas - Real JavaScriptd0nn9n
 
Chaos Engineering
Chaos EngineeringChaos Engineering
Chaos Engineering
Amazon Web Services
 
Architecture Patterns for Multi-Region Active-Active Applications (ARC209-R2)...
Architecture Patterns for Multi-Region Active-Active Applications (ARC209-R2)...Architecture Patterns for Multi-Region Active-Active Applications (ARC209-R2)...
Architecture Patterns for Multi-Region Active-Active Applications (ARC209-R2)...
Amazon Web Services
 
Microservices @ SoundCloud
Microservices @ SoundCloudMicroservices @ SoundCloud
Microservices @ SoundCloud
Bora Tunca
 
Cloud Security Primer - F5 Networks
Cloud Security Primer - F5 NetworksCloud Security Primer - F5 Networks
Cloud Security Primer - F5 Networks
Harry Gunns
 
Explaining The Semantic Web
Explaining The Semantic WebExplaining The Semantic Web
Explaining The Semantic WebAditya Tuli
 
Maintaining the Front Door to Netflix : The Netflix API
Maintaining the Front Door to Netflix : The Netflix APIMaintaining the Front Door to Netflix : The Netflix API
Maintaining the Front Door to Netflix : The Netflix API
Daniel Jacobson
 
Practical Tips for Ops: End User Monitoring
Practical Tips for Ops: End User MonitoringPractical Tips for Ops: End User Monitoring
Practical Tips for Ops: End User Monitoring
Dynatrace
 
Scaling Crittercism to 30,000 Requests Per Second and Beyond with MongoDB
Scaling Crittercism to 30,000 Requests Per Second and Beyond with MongoDBScaling Crittercism to 30,000 Requests Per Second and Beyond with MongoDB
Scaling Crittercism to 30,000 Requests Per Second and Beyond with MongoDBMongoDB
 

Similar to Frontend Resilience (20)

Building Global Multi-Region, Active-Active Serverless Backends
Building Global Multi-Region, Active-Active Serverless Backends Building Global Multi-Region, Active-Active Serverless Backends
Building Global Multi-Region, Active-Active Serverless Backends
 
Progressive Web Apps for Education
Progressive Web Apps for EducationProgressive Web Apps for Education
Progressive Web Apps for Education
 
Выявление и локализация проблем в сети с помощью инструментов Riverbed
Выявление и локализация проблем в сети с помощью инструментов RiverbedВыявление и локализация проблем в сети с помощью инструментов Riverbed
Выявление и локализация проблем в сети с помощью инструментов Riverbed
 
KRNIC Data Driven DNS Security
KRNIC Data Driven DNS SecurityKRNIC Data Driven DNS Security
KRNIC Data Driven DNS Security
 
Migrating Oracle to Aurora PostgreSQL Utilizing AWS Database Migration Servic...
Migrating Oracle to Aurora PostgreSQL Utilizing AWS Database Migration Servic...Migrating Oracle to Aurora PostgreSQL Utilizing AWS Database Migration Servic...
Migrating Oracle to Aurora PostgreSQL Utilizing AWS Database Migration Servic...
 
Running a Megasite on Microsoft Technologies
Running a Megasite on Microsoft TechnologiesRunning a Megasite on Microsoft Technologies
Running a Megasite on Microsoft Technologies
 
IRJET - Review on Search Engine Optimization
IRJET - Review on Search Engine OptimizationIRJET - Review on Search Engine Optimization
IRJET - Review on Search Engine Optimization
 
Catalyze Webcast - Five Myths Of RIA With Laurie Gray - 031808
Catalyze Webcast - Five Myths Of RIA With Laurie Gray - 031808Catalyze Webcast - Five Myths Of RIA With Laurie Gray - 031808
Catalyze Webcast - Five Myths Of RIA With Laurie Gray - 031808
 
Web Performance 101
Web Performance 101Web Performance 101
Web Performance 101
 
Presentation to customers sharing flash across virtualized workloads (1)
Presentation to customers   sharing flash across virtualized workloads (1)Presentation to customers   sharing flash across virtualized workloads (1)
Presentation to customers sharing flash across virtualized workloads (1)
 
Douglas - Real JavaScript
Douglas - Real JavaScriptDouglas - Real JavaScript
Douglas - Real JavaScript
 
Chaos Engineering
Chaos EngineeringChaos Engineering
Chaos Engineering
 
Architecture Patterns for Multi-Region Active-Active Applications (ARC209-R2)...
Architecture Patterns for Multi-Region Active-Active Applications (ARC209-R2)...Architecture Patterns for Multi-Region Active-Active Applications (ARC209-R2)...
Architecture Patterns for Multi-Region Active-Active Applications (ARC209-R2)...
 
Microservices @ SoundCloud
Microservices @ SoundCloudMicroservices @ SoundCloud
Microservices @ SoundCloud
 
Cloud Security Primer - F5 Networks
Cloud Security Primer - F5 NetworksCloud Security Primer - F5 Networks
Cloud Security Primer - F5 Networks
 
Explaining The Semantic Web
Explaining The Semantic WebExplaining The Semantic Web
Explaining The Semantic Web
 
Maintaining the Front Door to Netflix : The Netflix API
Maintaining the Front Door to Netflix : The Netflix APIMaintaining the Front Door to Netflix : The Netflix API
Maintaining the Front Door to Netflix : The Netflix API
 
Practical Tips for Ops: End User Monitoring
Practical Tips for Ops: End User MonitoringPractical Tips for Ops: End User Monitoring
Practical Tips for Ops: End User Monitoring
 
Scaling Crittercism to 30,000 Requests Per Second and Beyond with MongoDB
Scaling Crittercism to 30,000 Requests Per Second and Beyond with MongoDBScaling Crittercism to 30,000 Requests Per Second and Beyond with MongoDB
Scaling Crittercism to 30,000 Requests Per Second and Beyond with MongoDB
 
thesisSlides
thesisSlidesthesisSlides
thesisSlides
 

Recently uploaded

Monitoring Java Application Security with JDK Tools and JFR Events
Monitoring Java Application Security with JDK Tools and JFR EventsMonitoring Java Application Security with JDK Tools and JFR Events
Monitoring Java Application Security with JDK Tools and JFR Events
Ana-Maria Mihalceanu
 
Alt. GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using ...
Alt. GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using ...Alt. GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using ...
Alt. GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using ...
James Anderson
 
FIDO Alliance Osaka Seminar: Overview.pdf
FIDO Alliance Osaka Seminar: Overview.pdfFIDO Alliance Osaka Seminar: Overview.pdf
FIDO Alliance Osaka Seminar: Overview.pdf
FIDO Alliance
 
Le nuove frontiere dell'AI nell'RPA con UiPath Autopilot™
Le nuove frontiere dell'AI nell'RPA con UiPath Autopilot™Le nuove frontiere dell'AI nell'RPA con UiPath Autopilot™
Le nuove frontiere dell'AI nell'RPA con UiPath Autopilot™
UiPathCommunity
 
zkStudyClub - Reef: Fast Succinct Non-Interactive Zero-Knowledge Regex Proofs
zkStudyClub - Reef: Fast Succinct Non-Interactive Zero-Knowledge Regex ProofszkStudyClub - Reef: Fast Succinct Non-Interactive Zero-Knowledge Regex Proofs
zkStudyClub - Reef: Fast Succinct Non-Interactive Zero-Knowledge Regex Proofs
Alex Pruden
 
Transcript: Selling digital books in 2024: Insights from industry leaders - T...
Transcript: Selling digital books in 2024: Insights from industry leaders - T...Transcript: Selling digital books in 2024: Insights from industry leaders - T...
Transcript: Selling digital books in 2024: Insights from industry leaders - T...
BookNet Canada
 
DevOps and Testing slides at DASA Connect
DevOps and Testing slides at DASA ConnectDevOps and Testing slides at DASA Connect
DevOps and Testing slides at DASA Connect
Kari Kakkonen
 
The Future of Platform Engineering
The Future of Platform EngineeringThe Future of Platform Engineering
The Future of Platform Engineering
Jemma Hussein Allen
 
Epistemic Interaction - tuning interfaces to provide information for AI support
Epistemic Interaction - tuning interfaces to provide information for AI supportEpistemic Interaction - tuning interfaces to provide information for AI support
Epistemic Interaction - tuning interfaces to provide information for AI support
Alan Dix
 
The Art of the Pitch: WordPress Relationships and Sales
The Art of the Pitch: WordPress Relationships and SalesThe Art of the Pitch: WordPress Relationships and Sales
The Art of the Pitch: WordPress Relationships and Sales
Laura Byrne
 
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...
DanBrown980551
 
FIDO Alliance Osaka Seminar: FIDO Security Aspects.pdf
FIDO Alliance Osaka Seminar: FIDO Security Aspects.pdfFIDO Alliance Osaka Seminar: FIDO Security Aspects.pdf
FIDO Alliance Osaka Seminar: FIDO Security Aspects.pdf
FIDO Alliance
 
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdfFIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
FIDO Alliance
 
Enhancing Performance with Globus and the Science DMZ
Enhancing Performance with Globus and the Science DMZEnhancing Performance with Globus and the Science DMZ
Enhancing Performance with Globus and the Science DMZ
Globus
 
By Design, not by Accident - Agile Venture Bolzano 2024
By Design, not by Accident - Agile Venture Bolzano 2024By Design, not by Accident - Agile Venture Bolzano 2024
By Design, not by Accident - Agile Venture Bolzano 2024
Pierluigi Pugliese
 
The Metaverse and AI: how can decision-makers harness the Metaverse for their...
The Metaverse and AI: how can decision-makers harness the Metaverse for their...The Metaverse and AI: how can decision-makers harness the Metaverse for their...
The Metaverse and AI: how can decision-makers harness the Metaverse for their...
Jen Stirrup
 
Removing Uninteresting Bytes in Software Fuzzing
Removing Uninteresting Bytes in Software FuzzingRemoving Uninteresting Bytes in Software Fuzzing
Removing Uninteresting Bytes in Software Fuzzing
Aftab Hussain
 
Free Complete Python - A step towards Data Science
Free Complete Python - A step towards Data ScienceFree Complete Python - A step towards Data Science
Free Complete Python - A step towards Data Science
RinaMondal9
 
UiPath Community Day Dubai: AI at Work..
UiPath Community Day Dubai: AI at Work..UiPath Community Day Dubai: AI at Work..
UiPath Community Day Dubai: AI at Work..
UiPathCommunity
 
Video Streaming: Then, Now, and in the Future
Video Streaming: Then, Now, and in the FutureVideo Streaming: Then, Now, and in the Future
Video Streaming: Then, Now, and in the Future
Alpen-Adria-Universität
 

Recently uploaded (20)

Monitoring Java Application Security with JDK Tools and JFR Events
Monitoring Java Application Security with JDK Tools and JFR EventsMonitoring Java Application Security with JDK Tools and JFR Events
Monitoring Java Application Security with JDK Tools and JFR Events
 
Alt. GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using ...
Alt. GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using ...Alt. GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using ...
Alt. GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using ...
 
FIDO Alliance Osaka Seminar: Overview.pdf
FIDO Alliance Osaka Seminar: Overview.pdfFIDO Alliance Osaka Seminar: Overview.pdf
FIDO Alliance Osaka Seminar: Overview.pdf
 
Le nuove frontiere dell'AI nell'RPA con UiPath Autopilot™
Le nuove frontiere dell'AI nell'RPA con UiPath Autopilot™Le nuove frontiere dell'AI nell'RPA con UiPath Autopilot™
Le nuove frontiere dell'AI nell'RPA con UiPath Autopilot™
 
zkStudyClub - Reef: Fast Succinct Non-Interactive Zero-Knowledge Regex Proofs
zkStudyClub - Reef: Fast Succinct Non-Interactive Zero-Knowledge Regex ProofszkStudyClub - Reef: Fast Succinct Non-Interactive Zero-Knowledge Regex Proofs
zkStudyClub - Reef: Fast Succinct Non-Interactive Zero-Knowledge Regex Proofs
 
Transcript: Selling digital books in 2024: Insights from industry leaders - T...
Transcript: Selling digital books in 2024: Insights from industry leaders - T...Transcript: Selling digital books in 2024: Insights from industry leaders - T...
Transcript: Selling digital books in 2024: Insights from industry leaders - T...
 
DevOps and Testing slides at DASA Connect
DevOps and Testing slides at DASA ConnectDevOps and Testing slides at DASA Connect
DevOps and Testing slides at DASA Connect
 
The Future of Platform Engineering
The Future of Platform EngineeringThe Future of Platform Engineering
The Future of Platform Engineering
 
Epistemic Interaction - tuning interfaces to provide information for AI support
Epistemic Interaction - tuning interfaces to provide information for AI supportEpistemic Interaction - tuning interfaces to provide information for AI support
Epistemic Interaction - tuning interfaces to provide information for AI support
 
The Art of the Pitch: WordPress Relationships and Sales
The Art of the Pitch: WordPress Relationships and SalesThe Art of the Pitch: WordPress Relationships and Sales
The Art of the Pitch: WordPress Relationships and Sales
 
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...
 
FIDO Alliance Osaka Seminar: FIDO Security Aspects.pdf
FIDO Alliance Osaka Seminar: FIDO Security Aspects.pdfFIDO Alliance Osaka Seminar: FIDO Security Aspects.pdf
FIDO Alliance Osaka Seminar: FIDO Security Aspects.pdf
 
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdfFIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
 
Enhancing Performance with Globus and the Science DMZ
Enhancing Performance with Globus and the Science DMZEnhancing Performance with Globus and the Science DMZ
Enhancing Performance with Globus and the Science DMZ
 
By Design, not by Accident - Agile Venture Bolzano 2024
By Design, not by Accident - Agile Venture Bolzano 2024By Design, not by Accident - Agile Venture Bolzano 2024
By Design, not by Accident - Agile Venture Bolzano 2024
 
The Metaverse and AI: how can decision-makers harness the Metaverse for their...
The Metaverse and AI: how can decision-makers harness the Metaverse for their...The Metaverse and AI: how can decision-makers harness the Metaverse for their...
The Metaverse and AI: how can decision-makers harness the Metaverse for their...
 
Removing Uninteresting Bytes in Software Fuzzing
Removing Uninteresting Bytes in Software FuzzingRemoving Uninteresting Bytes in Software Fuzzing
Removing Uninteresting Bytes in Software Fuzzing
 
Free Complete Python - A step towards Data Science
Free Complete Python - A step towards Data ScienceFree Complete Python - A step towards Data Science
Free Complete Python - A step towards Data Science
 
UiPath Community Day Dubai: AI at Work..
UiPath Community Day Dubai: AI at Work..UiPath Community Day Dubai: AI at Work..
UiPath Community Day Dubai: AI at Work..
 
Video Streaming: Then, Now, and in the Future
Video Streaming: Then, Now, and in the FutureVideo Streaming: Then, Now, and in the Future
Video Streaming: Then, Now, and in the Future
 

Frontend Resilience