samedi, 29 octobre 2016

Le projet Quantum de Mozilla, des ambitions et des précisions

Après un premier billet qui traçait les grandes lignes du projet et sa philosophie (Un saut quantique pour le Web) nous disposons maintenant d’un peu plus de précisions techniques grâce à cet article de Bill Mc Closkey que nous vous traduisons ci-dessous : après avoir mentionné les quatre projets distincts mais associés sous la bannière de Quantum, Bill nous expose l’avancement du projet Quantum Code et invite déjà à contribuer. Bill travaille notamment sur les processus séparés chez Mozilla, il n’est donc guère surprenant de le retrouver ici impliqué sur le projet Quantum.

Traduction MozFr : Julien / Sphinx, Jérémie et Goofy

Capture_du_2016-10-28_23-43-53.png
 

Quantum comporte quatre projets distincts…

Le projet Quantum CSS remplacera le moteur CSS de Gecko par celui de Servo. Le moteur de Servo permet un parallélisme massif, pas celui de Gecko.

Le projet Quantum DOM va rendre Gecko plus adaptatif, particulièrement dans le cas où de très nombreux onglets sont ouverts en arrière-plan. Lorsque le Quantum DOM sera achevé, le code JS de différents onglets (et peut-être de différents iframes) tournera de façon coordonnée et planifiée entre différents threads de sorte que le code de plusieurs onglets en arrière-plan ne s’interrompe jamais.

Le Compositor de Quantum remplacera celui de Gecko par le sien propre. Comme l’instabilité des drivers graphiques est une cause principale des plantages de Firefox, nous espérons que transférer le code qui interagit avec le GPU rendra Firefox beaucoup plus stable.

Enfin, Quantum Rendering remplacera le sous-système de rendu graphique de Gecko par celui de Servo, appelé WebRenderer. Servo utilise le GPU de façon plus efficace que Gecko, il le pilote comme le ferait un jeu plutôt que comme un navigateur a l’habitude de le faire.

Ces projets en sont à des stades d’avancement divers. Le projet Quantum Compositor est déjà bien avancé alors que Quantum Rendering n’en est qu’à ses débuts. Il existe encore pas mal d’incertitudes sur ces projets. Toutefois je veux dire quelques mots à propos de Quantum DOM, le projet sur lequel je travaille.

Quantum DOM

Quantum DOM est essentiellement conçu pour que le contenu web fonctionne mieux et pour que les « accrocs » soient plus rares (il s’agit des pénibles petits sursauts et hoquets qui dégradent l’expérience de navigation). Un grand nombre de ces accrocs viennent des onglets en arrière-plan et des publicités. Voyez leur évaluation sur le bug 1296486. Un moyen pratique de réduire ces nuisances consiste à faire tourner chaque onglet et autre cadre de rendu de l’onglet dans son propre processus. Dans la mesure où les systèmes d’exploitation organisent les processus de manière préemptive, les cadres en arrière-plan peuvent toujours êtres interrompus pour favoriser le travail d’avant-plan.

Malheureusement, si l’on augmente le nombre de processus de contenu on augmente aussi la consommation de mémoire. D’après les expériences préliminaires que nous avons menées, il semble peu probable que nous puissions augmenter le nombre de processus de contenu au-delà de 8 dans un futur proche ; tout processus supplémentaire augmenterait de façon inacceptable la consommation de mémoire. Il vaut certainement mieux avoir 8 processus au lieu d’un, mais de nombreux utilisateurs ont plus de 8 onglets ouverts simultanément. Les développeurs de Mozilla travaillent à réduire la consommation excessive de mémoire des processus de contenu, mais nous ne pourrons jamais réduire cet excès à zéro. Nous explorons donc d’autres pistes, comme l’ordonnancement coopératif pour les onglets et le gel des onglets.

L’ordonnancement coopératif

Quantum DOM est une approche alternative qui vise à réduire les accrocs de performance sans augmenter la quantité de mémoire utilisée. Plutôt que de placer les différents cadres de rendu dans différents processus, nous les placerons dans des threads séparés. Plutôt que d’utiliser les threads du système d’exploitation, nous utiliserons des threads ordonnancés de façon coopérative dans la sphère de l’utilisateur (NDT : user space : tout le code qui n’est pas lié au cœur du système d’exploitation). L’avantage des threads est qu’ils permettent de partager un même espace d’adressage ce qui facilite le partage de données. L’inconvénient c’est que ces données partagées doivent être protégées par des verrous. Les threads ordonnancés de façon coopérative nous permettent de passer d’un thread à l’autre de manière « sûre » à des endroits où l’état partagé est censément consistant, rendant de fait les verrous inutiles (ou à minima, moins nécessaires).

Firefox dispose d’ores et déjà d’un ensemble de points de transition sûrs. Le moteur JavaScript est capable de se mettre en pause lors d’un appel de fonction ou d’un tour de boucle afin d’exécuter un autre code. Nous utilisons d’ailleurs déjà cette capacité pour mettre en œuvre la fenêtre de dialogue « script lent » qui permet à un utilisateur d’arrêter une boucle infinie. Cependant, le même mécanisme peut être utilisé pour passer d’un thread à l’autre et commencer à exécuter du code issu d’un nouveau cadre de rendu.

Nous avons déjà commencé certaines expérimentations autour de ces concepts. Le bug 1279086, déployé dans Firefox 51, nous permet de mettre en pause l’exécution de JavaScript afin de rafraîchir l’affichage lors d’un changement d’onglet. Nos mesures de télémétrie nous indiquent que la conséquence directe de ceci est une diminution de moitié du nombre de changements d’onglets lents (> 300 ms). Nous espérons utiliser le même genre de démarche dans un futur proche pour pouvoir rafraîchir l’affichage des pages pendant le scrolling, même si une page d’arrière-plan est en train de faire tourner du JavaScript.

Notre objectif ultime cependant, c’est d’exécuter tous les cadres de rendu dans leur propre thread ordonnancé de manière coopérative. Cela nous permettra de mettre en pause un onglet d’arrière-plan afin de prioriser un certain nombre de tâches (i.e. les évènements d’entrée ou les animations) dans un onglet d’avant-plan. Avant d’en arriver là, il nous faut « étiqueter » toutes les tâches de notre pile d’évènements pour pouvoir les faire correspondre au cadre auquel elles appartiennent. De cette façon nous pourrons exécuter chaque tâche dans le thread qui lui correspond.

Étiqueter les tâches et les prioriser est un énorme travail. Michael Layzell est en train de construire une abstraction de regroupement (“DocGroup”) de manière à ce que les cadres de même origine (ceux qui peuvent dialoguer via window.parent ou window.opener) s’exécutent dans le même thread (bug 1303196). Andreas Farre est en train de mettre en place un mécanisme permettant d’organiser les tâches à basse priorités comme le GC (bug 1198381). Olli Pettay et Thinker Li sont, eux, en train de créer un mécanisme similaire pour les tâches à haute priorité comme les évènements d’entrée (bug 1306591). Au fur et à mesure de l’amélioration de notre infrastructure d’étiquetage dans les prochaines semaines, cet étiquetage des tâches sera un point d’entrée idéal pour les contributeurs qui veulent rejoindre le projet. L’état d’avancement du projet sera régulièrement publié sur la liste de diffusion dev-platform.

Finalement, nous pourrons envisager d’exécuter nos cadres de rendu dans leur propre thread géré par le système d’exploitation de façon préemptive. L’avantage des threads du système d’exploitation par rapport aux threads « utilisateur » c’est leur capacité à utiliser plusieurs cœurs du processeur. Cependant nos threads d’utilisateur seront déjà répartis sur 4 à 8 processus et la plupart des utilisateurs n’ont pas vraiment plus de cœurs de processeurs disponibles. Au fur et à mesure de l’avancée du projet nous évaluerons à nouveau si exploiter les threads du système d’exploitation nous semble pertinent.

Enfin, ce serait négligence de ma part de ne pas indiquer qu’Opera a été le premier à travailler sur une architecture d’ordonnancement coopératif. Ce sont eux qui ont accompli tout ça en premier.

Geler les onglets

Lors de nos discussions sur les méthodes d’ordonnancement du travail d’arrière-plan, nous nous sommes demandés : pourquoi exécuter quoi que ce soit ? Firefox réduit déjà la fréquence de certaines actions d’arrière-plan telles que les tâches setTimeout qui sont exécutées au plus une fois par seconde. Il est très probable que nous continuerons dans cette direction et que nous ralentirons encore plus. Pourrait-on envisager d’être encore plus agressifs et de geler complètement certains des onglets d’arrière-plan ?

freeze.png
 

Il n’est pas toujours possible de geler des onglets d’arrière-plan car certains doivent continuer à tourner. Par exemple, vous voulez que Pandora continue de lire votre musique même lorsque vous changez d’onglet. Vous voulez également que Gmail vous notifie de l’arrivée d’un e-mail même lorsque l’onglet Gmail n’est pas sélectionné. Cependant, si le navigateur avait la capacité d’identifier ces onglets « importants », nous pourrions geler le reste. Nous sommes toujours en train de définir les heuristiques qui nous permettront d’identifier les onglets d’arrière-plan importants. Ehsan Akhgari explore certaines pistes de travail que nous espérons pouvoir tester dans Firefox Nightly prochainement.

Capture_du_2016-10-29_00-06-02.png
Cliquez sur la bannière pour adopter Firefox Nightly en français

jeudi, 27 octobre 2016

Un saut quantique pour le Web

davidBryant.jpeg

Cet article est la traduction du billet A Quantum Leap for the Web écrit par David Bryant. David est à la tête de l’équipe Platform Engineering de Mozilla et il annonce ici le lancement et le futur proche du projet Quantum, qui vise à renouveler entièrement plusieurs composants majeurs sur lesquels reposent les technologies web actuelles.

Traduction MozFr : Sphinx, TheGennok et Goofy.

Lire la suite

dimanche, 18 septembre 2016

Les onglets contextuels dans Firefox Nightly

icône menu hamburger

Attention : cette fonctionnalité est encore expérimentale et peut être amenée à évoluer :) Pourquoi faire ? « Mais dis-moi plutôt qui tu es ? », Rafiki, Le Roi Lion Lorsque nous naviguons sur le Web, nous utilisons différents sites pour différents besoins. Notre identité numérique se compose parfois  […]

Lire la suite

mercredi, 8 juin 2016

Aider les développeurs web à propos des erreurs JavaScript

Ce billet est une traduction de Helping web developers with JavaScript errors, écrit par Florian Scholz et Morgan Phillips.

Lire la suite

vendredi, 20 mai 2016

Techniques de développement CSS

La cascade CSS via l'inspecteur

Cet article est une traduction de CSS coding techniques écrit par Belén Albeza. Belén travaille au sein de l’équipe DevRel de Mozilla et explique ici sa méthode de travail pour le code CSS afin d’obtenir des feuilles de style claires et qui puissent être maintenues facilement. Comme les autres articles de ce blog, celui-ci est placé en licence CC-BY-SA.

Merci beaucoup à Marine, Ilphrin, Banban, Sandlayth, au traducteur anonyme ainsi qu’à goofy pour sa relecture utile :)


Lire la suite

dimanche, 17 avril 2016

Ma méthode de travail avec Git et GitHub

Schéma du workflow

Cet article est une traduction de Documenting my git/GitHub worklow écrit par Karl Dubost. Karl participe au projet WebCompat pour veiller à ce que les sites web fonctionnent de façon égale sur les différents navigateurs et ce billet est l’occasion de présenter la méthode de travail qu’il utilise avec Git et GitHub. Les méthodes vues ici pourront être utile pour contribuer à d’autres projets, n’hésitez pas à guetter les fichiers CONTRIBUTING.md des différents dépôts. ;)


Lire la suite

mardi, 29 mars 2016

Aide aux développeurs pour les changements à venir dans le développement de modules

Cet article est une traduction de la communauté Mozfr de Developer support for changes in add-on development. Comme vous en avez peut-être entendu parler, de nombreux changements surviennent dans le développement des modules complémentaires. Fin 2017, les WebExtensions seront utilisées par Firefox  […]

Lire la suite

samedi, 5 mars 2016

Proposition de spécification pour l'API WebVR 1.0

WebVR Showcase

Cet article est une traduction de Introducing the WebVR 1.0 API Proposal écrit par Casey Yee et publié sur Hacks.

Merci beaucoup à Ilphrin et Thegennok pour la traduction ! Merci goofy pour la relecture :)


Lire la suite

samedi, 27 février 2016

La propriété background-clip et ses cas d'utilisation

Le modèle de boites

Cet article est une traduction de The background-clip Property and its Use Cases, écrit par Ana Tudor et publié sur CSS Tricks. Ana Tudor réalise de nombreuses démos sur CSS sur CodePen et via Twitter et cet article est l’occasion d’en dire un peu plus sur la propriété background-clip. Merci beaucoup à marine, Banban, Thegennok et Ilphrin pour la traduction et à Théo et goofy pour la relecture.

Lire la suite

samedi, 23 janvier 2016

Firefox et l'API Web Speech

Page about:Webspeech dans la vie conjugale

Ce billet est une traduction de l’article de Chris David Mills : Firefox and the WebSpeech API. Bien que la reconnaissance vocale ne soit pas encore tout à fait opérationnelle dans Firefox, n’hésitez pas à décortiquer les démos ! Merci à goofy pour la relecture :)

Lire la suite

samedi, 16 janvier 2016

Du nouveau pour les outils de développement dans Firefox

venkman-opt.png

Ce billet est une traduction du billet de Patrick Brosset : Revisiting Firefox’s DevTools. Merci à marine et Banban pour la traduction et à Maxime pour celle des articles MDN sur les outils de développement !

Lire la suite

samedi, 26 décembre 2015

Hors ligne et plus encore

Ce billet est une traduction du billet de Salva, Beyond Offline. Cet article est la suite du billet précédent sur les service workers. Merci à marine et Thegennok pour la traduction et à goofy pour la relecture !

Lire la suite

Recettes hors connexion pour les service workers

Page about:serviceworkers dans Firefox Developer Edition

Ce billet est une traduction du billet de David Walsh, Offline Recipes for Service Workers. Un grand merci à marine, Banban, Thegennok, LaPalice pour la traduction et à goofy pour la relecture. Bonne lecture et bonnes fêtes !

Lire la suite

jeudi, 17 décembre 2015

Enfin, on peut compiler en WebAssembly !

mamie fait du webAssembly

Ce billet est une traduction du billet publié par Alon Zakai sur hacks.mozilla.org.

Lire la suite

Les utilisateurs de Firefox sur Windows peuvent désormais regarder Netflix en HTML5

Ce billet est une traduction du billet en anglais paru sur le blog de Mozilla.

Lire la suite

lundi, 24 août 2015

ES6 en détails : l'avenir

typedarrays.png

Suite et fin de la la traduction, qui clôture la série d’articles de Jason Orendorff. L’article original se trouve ici. Vous pouvez retrouver les différents articles de la série grâce aux mots-clefs.

Merci à goofy pour la relecture :) !


Lire la suite

samedi, 22 août 2015

ES6 en détails : les modules

Suite de la traduction, qui continue la série d’articles de Jason Orendorff. L’article original se trouve ici. Vous pouvez retrouver les différents articles de la série grâce aux mots-clefs.

Merci à Banban et Ilphrin pour la traduction et merci à goofy pour la relecture :) !


Lire la suite

jeudi, 13 août 2015

ES6 en détails : les sous-classes et l'héritage

Suite de la traduction, qui continue la série d’articles de Jason Orendorff. L’article original se trouve ici. Vous pouvez retrouver les différents articles de la série grâce aux mots-clefs.

Merci à Banban et Marine pour la traduction et merci à goofy pour la relecture :) !


Lire la suite

vendredi, 7 août 2015

ES6 en détails : let et const

bogue.jpg

Suite de la traduction, qui continue la série d’articles de Jason Orendorff. L’article original se trouve ici. Vous pouvez retrouver les différents articles de la série grâce aux mots-clefs.

Merci à Banban et goofy pour la traduction et la relecture :) !


Lire la suite

vendredi, 31 juillet 2015

ES6 en détails : les classes

Suite de la traduction, qui continue la série d’articles de Jason Orendorff. L’article original se trouve ici. Vous pouvez retrouver les différents articles de la série grâce aux mots-clefs.

Merci à Jérémie et Banban pour la traduction et à goofy pour la relecture :) !


Lire la suite

- page 1 de 3