Build the mobile

web you want
@k88hudson
The web

is broken
UI perf
Offline/

intermittent

network
Auth/security
Device/OS
Integration
– browser vendors
We’re working on it
Native Web
ok pretty bad
terrible,
working on it
meh
ok sometimes
What do we do?
“I feel like it’s time to
revisit the web vs. native
debate, and concede defeat — or,
at least, concede that the web
cannot, and should not, compete
with native when it comes to
complex, app-like structures.”
“Conceding defeat will force us to
rethink the web’s purpose and
unique strengths — and that’s long
overdue.”
This is a totally reasonable,
rational argument
2004
Kazaa
Wallpapers
An app… in JavaScript?!
When I decided to write the
Gmail interface in Javascript,
pretty much everyone who knew
anything about Javascript or web
browsers told me that it was a
bad idea. It had been tried in
the past, and always ended in
disaster.
– Paul Buchheit, lead developer
of Gmail in 2004
“While I am personally opposed to
all use of JavaScript, I understand
that JavaScript can do some things
that you can't do with normal HTML…
Just remember, if Amazon can [do
without JavaScript], so can you.”
– “Anti-JavaScript FAQ”
“A lot of designers think it’s
their god-given right to annoy the
hell out of visitors with bulky
Javascript effects, so turning off
Javascript is almost a requirement
to visit some websites.”
– “Javascript is Evil”
“Blindly accepting a high level of
security risk on the web [by
enabling JavaScript] is as shaky as
a ride on the Canadian space
shuttle (made of birch bark and
pine gum)”
– “Stupid JavaScript Security Tricks”
“The XML HTTP thing”
“The XML HTTP thing”
You are here because

of a massive hack
Now is the time to hack
The three
levels of hack
Test new features before their time
The First Level of Hack
Service workers!!
(Coming to FF in fall 2015)
Transpile! Polyfill!
(This is not controversial stuff)
Build new abstractions
The Second Level of Hack
https://github.com/filerjs/filer
Blow sh*t up
The Third Level of Hack
What if you could
hack your user agent?
https://wiki.mozilla.org/Mobile/Get_Involved
“Hybrid apps”
https://cordova.apache.org/
Let’s build our own
• Poor offline experience
• Memory leaks in long-lived
processes
• UI perf
• Android <4.4
Basic architecture
Android Activity
Create an activity
MainActivity
main_activity
AndroidManifest.xml
Android Activity
Web view
Instantiate a WebView
MainActivity.java
What about Android 4.2, 4.0, ..?
https://crosswalk-project.org/
Android Activity
Web view
Communication
Layer
Loading resources
Expose a custom Java
interface to Javascript
Expose a custom Java
interface to Javascript
MainActivity.java
index.js
App.java
Similar to server side
routing, but we get native
Android transitions
What about state?
Web: React view
Android: Router,
SharedPreferences
JavascriptInterface.java
Passing route params
MainComponent.js
JavascriptInterface.java
Caching state
Caching state
MainComponent.js
Device integration?
Camera integration
Camera integration
What else?
• Bind to Android’s offline network
caching utilities
• Hook into native gestures
• Device/OS integration
• ???
Will it work? Who knows…
You get to build

the web you want
is finding adequate solutions
to problems that matter, in a
way that someone in the
future can understand and
improve on.
Really good engineering
Hack the good hack,
my friends
@k88hudson

Build the mobile web you want