Upgrade to Pro — share decks privately, control downloads, hide ads and more …

AMP & PWA Initiatives

anasbladz
July 07, 2017
Technology
1
210

AMP & PWA Initiatives

anasbladz

July 07, 2017
Tweet

More Decks by anasbladz

See All by anasbladz
What I Talk About When I Talk About Envisioning Information
anasbladz
0
180
A Postcard from Vancouver
anasbladz
0
210
Not so long road
anasbladz
0
130
Progressive Web App and Discovering on Principle
anasbladz
0
200
I-Kutan
anasbladz
1
260
Up and Running Web App
anasbladz
0
310
Achievement Motivation Training
anasbladz
0
170

Other Decks in Technology

See All in Technology
押しつけアジャイルは「ダメ。ゼッタイ。」
kitamu_mu
0
130
ユーザー体験を毀損せず収益は向上させる広告を実現したい
line_developers
PRO
2
440
カラーミーショップの改善におけるSRE活動について
homirun
0
270
Kubernetes-Meetup-Tokyo-53
masayoshimaezawa
1
590
Tale of Chaining Bugs for Account Takeover
harshbothra
2
1.3k
ファームウェアの Panic を 自動で収集・解析・分類・集計して 市場品質の改善サイクルを回す
hideakitai
0
140
Retca Cloud
bau
0
1.8k
Design for Failure with Startup
track3jyo
PRO
4
120
OCI技術資料 : ロード・バランサー 詳細 / Load Balancer 200
ocise
2
6.1k
Material3 with Jetpack Compose
yanzm
2
210
Using Change Data Capture for Stack Modernization
kamorisan
0
1.7k
マイク品質は重要！！ / Microphone quality matters
hamham1004
0
170

Featured

See All Featured
Support Driven Design
roundedbygravity
87
8.7k
The Art of Programming - Codeland 2020
erikaheidi
34
11k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
499
130k
10 Git Anti Patterns You Should be Aware of
lemiorhan
642
53k
The Straight Up "How To Draw Better" Workshop
denniskardys
225
130k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
12
980
Agile that works and the tools we love
rasmusluckow
319
19k
Making the Leap to Tech Lead
cromwellryan
113
7.5k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
29
4.8k
VelocityConf: Rendering Performance Case Studies
addyosmani
316
22k
Designing with Data
zakiwarfel
91
4k
Faster Mobile Websites
deanohume
294
29k

Transcript

  1. AMP and PWA Initiatives in Microservices Bukalapak.com

  2. • Slow Internet • Offline State • Expensive The Problem:

    Elephant(s) in the Room

  3. The Big Picture

  4. • AMP as one of primary funnel ◦ Golang •

    PWA initiatives ◦ Javascript stack (Node, Webpack, Vuejs) What We Did?

  5. • Product Detail ◦ Search page ◦ Add to cart

    ◦ Product Detail page • Category Page • Tag Page AMP Pages

  6. • Amp-analytics (all amp pages) • Amp-sidebar (all amp pages)

    • Amp-carousel (all amp pages) • Amp-install-serviceworker (all amp pages) • Amp-lightbox (product detail) • Amp-accordion (product detail) • Amp-bind (product detail) • Amp-selector (product detail) AMP Pages: Components

  7. PWA: Service Worker • Sw-precache • sw-toolbox

  8. PWA: Service Worker

  9. Insights - (PWA)

  10. Insights - (Performance)

  11. Offline Mode

  12. Offline Mode

  13. Thank You.