Latence et streaming api Devoxx France 2015

@StreamdataIO#streamingapi
Latence applicative et streaming API

@StreamdataIO#streamingAPI
Latence applicative et streaming API
Streamdata.io
Nicolas Babel / Allan Denis
Stand 23

Mémoire sensorielle
Durée : 0,5 max pour visuel
2 sec pour audio
Mémoire court-terme
Durée : 30 secondes max
Mémoire long-terme

6
Délai de réaction
d’une application
Impact /
sensation
sur
l’utilisateur
0,1 Secondes0,5 2 3 5 101 4
« Instantané »
Parfait
(eq. Relation
humaine)
Sans
attente
« Lent »
40 à 60%
d’abandon sur
le web desktop
« Très Lent »
30 à 40%
d’abandon sur
le web mobile
Perte d’attention
Enervement
Fatigue
Temps
« normal »

- 100 ms = - 1% Revenue & - 5% pages vues
Source : http://blog.radware.com/applicationdelivery/applicationaccelerationoptimization/2013/06/web-performance-poverty-line/
Source : http://www.ebaytechblog.com/2013/03/29/measuring-real-user-experience-with-site-speed-gauge/#.VFIHLvTF9CN
Source : http://www.webperformancetoday.com/2011/11/08/velocity-faster-mobile-sites-business-kpis-case-studies/

Latence réseau (RTD) par technologie
300
150
110
100
30
25
10
0 50 100 150 200 250 300 350
EDGE/2G
3G
4G
Trans-continental optic fiber
Trans-country optic fiber
ADSL
In-town private network
En ADSL, la première donnée utile arrive en 60 ms (HTTPs)
En 4G, la première donnée utile arrive en 300 ms (450ms en 3G)
ms
Hors RRC
(Radio
Resource
Controleur)

La perception
Le temps de communication est une fonction
La latence
Le débit
La quantité de donnée Le protocole
Le nombre de requêtes

Les données dynamiques de vos interfaces
• Cotes
(Bourse & Paris en ligne)
• Statuts / info réseaux sociaux
• Propositions de recherche
• Informations / News
• Stock de ressources limitées
(Sharing economy & promo)
• Prix
• Dashboard
(Cash, vente, …)
• Input lors de travail collaboratif
(texte, dessins, …)
• Info Jeu en ligne
(Classements & données de jeu)
• …

Exemples
• Netflix
• Google
• Twitter

Netflix

Netflix (Falcor + JSONG)
JSON Patch
Note : Taille tableau
dépend du device !
JSON Path + cache local +
polling optimized query
http://www.infoq.com/presentations/netflix-reactive-rest (Jafar Husain)

Google

Twitter

N’envoyer que la donnée utile : JSON Patch
http://jsonpatch.com/
Format pour décrire les modifications sur un document
JSON
{
"baz": "qux",
"foo": "bar"
}
[
{ "op": "replace", "path": "/baz",
"value": "boo" },
{ "op": "add", "path": "/hello",
"value": ["world"] },
{ "op": "remove", "path": "/foo"}
]
The original document
The patch
{
"baz": "boo",
"hello": ["world"]
}
The result

Comparaison des solutions pour données dynamiques
Compatibilité
Navigateur
Compabilité
infra web
Facilité à dev. Ressources
Device /
Réseau
Downstream Latence
applicative
Polling/Long
Polling
Websocket
SSE
Websocket : seul protocole réellement bidirectionnel

@YourTwitterHandle@YourTwitterHandle@StreamdataIO#streamingAPI
Demo : 2 mn chrono

@YourTwitterHandle#YourSessionHashtag
URL api Uber
https://api.uber.com/v1/estimates/time?
start_latitude=33.9799396&
start_longitude=-118.3343132&
server_token=
LNiO_-f8xKfUM4qPDYnX4UbCNxSQd061k1NIhfLK
https://proxy.streamdata.io/
https://api.uber.com/v1/estimates/time?
start_latitude=33.9799396&
start_longitude=-118.3343132&
server_token=
LNiO_-f8xKfUM4qPDYnX4UbCNxSQd061k1NIhfLK

Summary

Conclusions
1. Objectif 0,5 seconde de latence applicative
2. Mettre des données dynamiques
3. « Plus les UI des autres sont biens, plus la tienne est
pourrie »
(A. Einstein, « Relativity concept applied to UX », Plon, 1932)
4. Venez nous voir stand 23

Q & A

Latence et streaming api Devoxx France 2015

Recommandé

Recommandé

Contenu connexe

Similaire à Latence et streaming api Devoxx France 2015

Similaire à Latence et streaming api Devoxx France 2015 (20)

Latence et streaming api Devoxx France 2015

Notes de l'éditeur