Mardi 6 décembre avait lieu le meetup organisé par Wort.lu. Le thème portait sur les “isomorphic Apps with React.js” ou « Apps Isomorphiques avec React.js », présenté par Alain Vagner, Thierry Nicola et Romain Chivot.
Le but d’une application isomorphique est d’utiliser son code sur le client et le serveur. Dans le cas présenté ici, l’objectif est d’avoir un chargement du contenu visuel plus rapide en “montant” les composants React avant d’avoir chargé les scripts. Les composants étant envoyés par le serveur sous forme HTML.
Cela permet au passage d’avoir un meilleur SEO (Search Engine Optimization) car les “robots” de Google et consorts ne lisent que le HTML.
Je vais vous faire un retour sur leurs expérimentations, détaillant leurs différentes tentatives pour rendre les composants React avec leur serveur.
Mais comment exécuter du JavaScript sur son serveur?
Chez Wort, le serveur est écrit en Scala, pas en JavaScript. Donc pour utiliser ReactDOMServer, ils ont commencé par utiliser la VM JavaScript “Nashorn”.
Utiliser une machine virtuelle dans la JVM pour évaluer son JS, dans le but d’augmenter ses performances, semble très compliqué. Et après quelques tests, les performances se sont logiquement révélées être pires qu’avant.
ScriptEngine engine = new ScriptEngineManager()
.getEngineByName("nashorn");
engine.eval("print('Hello World');");
De bonne performance en perspective !
Node.js – Un choix naturel
Après nous avoir présenté cette tentative, ils ont montré leur solution avec un serveur Node en parallèle de leur serveur existant.
Dans leur exemple, le serveur Scala interroge le serveur Node qui fournit le composant React monté (du HTML).
Un système qui se montre bien plus performant, comme le prouvent les tests présentés durant le talk.
Les benchmarks
Les performances d’Apps Isomorphiques sont similaires entre le rendu côté serveur Node et sans rendu serveur.
Mais comme expliqué durant le Meetup, si le client interroge directement le serveur Node sans passer par Scala pour le premier rendu, les performances pourraient être encore meilleures. C’est une autre piste à explorer pour Wort, avant de passer en production leur application isomorphique.
Retrouvez les slides à cette adresse et le Github du répo qui a servi pour la démo ici.
Si vous avez des questions sur le sujet, n’hésitez pas à commenter !
The post Débrief : meetup autour des apps isomorphiques avec React.js appeared first on SFEIR Mag.