From 3335211db9ecb67dc0ccd9c4a7c1eb607ffe359f Mon Sep 17 00:00:00 2001 From: SphinxKnight Date: Fri, 17 Sep 2021 20:15:31 +0200 Subject: Prepare CSS section for Markdown conversion (#2307) * Removes summary / seoSummary classes * Remove div class=hidden and some notranslate * Remove hidden paragraphs for live sample * Remove hidden paragraphs for live sample - take 2 * Remove other hidden div and p - updated w/ en-US when necessary * Remove ids * Remove notranslate class * Fix typo which broke build * remove div class='index' * remove useless * remove non typographical sups * remove non typographical subs * remove blockindicator and fix some div.note * fix build :/ * remove useless classes * fix build - again :x * fix unhandled elements 1/N + embedlivesample build fail * fix div.warning * Fix fixable flaws - hoping to reduce error conversion * Remove unecessary images (same as en-US) * fix div notes * fix warnings * fix some dl handling * fix dls * Fix a bunch of conversion errors * rm unhandled figures * Fix other set of issues and revamp easing-function page * Fix some one-offs conversion errors (incl. deki files) * fix the rest of one-off conversion issues * Fix last dl standing --- files/fr/web/css/will-change/index.html | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) (limited to 'files/fr/web/css/will-change') diff --git a/files/fr/web/css/will-change/index.html b/files/fr/web/css/will-change/index.html index 0fcad00b3c..fd846b0880 100644 --- a/files/fr/web/css/will-change/index.html +++ b/files/fr/web/css/will-change/index.html @@ -12,10 +12,10 @@ translation_of: Web/CSS/will-change

La propriété will-change fournit une indication au navigateur sur la propension d'un élément à changer (afin que le navigateur puisse mettre en place les optimisations nécessaires avant que l'élément change vraiment). Ce type d'optimisation permet d'augmenter la réactivité de la page en effectuant des calculs (éventuellement coûteux) en prévision du changement.

-

Attention ! will-change est conçu pour être utilisé en dernier recours afin d'aider à la résolutions de problèmes de performance existants. Il ne doit pas être utilisé partout de façon purement préventive.

+

Attention : will-change est conçu pour être utilisé en dernier recours afin d'aider à la résolutions de problèmes de performance existants. Il ne doit pas être utilisé partout de façon purement préventive.

-
/* Avec un mot-clé */
+
/* Avec un mot-clé */
 will-change: auto;
 will-change: scroll-position;
 will-change: contents;
@@ -33,7 +33,7 @@ will-change: unset;
 
 
    
  
  • 
-  
    Il ne faut pas appliquer will-change à de trop nombreux éléments. Le navigateur essaie déjà d'optimiser de nombreuses choses. Certaines de ces optimisations sont fortement couplées avec will-change pour utiliser les ressources de l'ordinateur. Aussi, si will-change est « trop » utilisé, cela peut ralentir la page et consommer intensivement les ressources.
    
+  
    Il ne faut pas appliquer will-change à de trop nombreux éléments. Le navigateur essaie déjà d'optimiser de nombreuses choses. Certaines de ces optimisations sont fortement couplées avec will-change pour utiliser les ressources de l'ordinateur. Aussi, si will-change est « trop » utilisé, cela peut ralentir la page et consommer intensivement les ressources.
    
  
    • 
  
  • 
   
    À utiliser avec parcimonie. Normalement, le navigateur essaie d'appliquer les optimisations dès que possible afin de revenir au plus vite dans un état normal. En revanche, en utilisant will-change dans la feuille de style, on indique que les éléments ciblés vont bientôt changer et le navigateur conservera les optimisations en cours beaucoup plus longtemps si la propriété est maintenue. Il est donc conseillé d'activer et de désactiver will-change de façon pertinente grâce à du script avant et après le changement concerné.
    
@@ -42,10 +42,10 @@ will-change: unset;
   
    Ne pas « sur-optimiser » avec will-change. Si votre page fonctionne correctement, n'ajoutez pas la propriété will-change sur certains éléments uniquement pour gagner un peu de vitesse. will-change est conçu pour être utilisé en dernier ressort afin de régler les problèmes de performances existants. En utilisant will-change trop souvent, cela consommera plus de mémoire, complexifiera le rendu de la page pour le navigateur (qui se préparera au changement). En bref, cela réduira les performances de la page.
    
  
    • 
  
  • 
-  
    Laisser le temps à will-change pour qu'il fonctionne. Cette propriété est conçue pour permettre aux auteurs d'indiquer à l'agent-utilisateur les propriétés qui vont probablement changer afin que le navigateur puisse optimiser en avance de phase. Il est donc important de laisser le temps au navigateur d'appliquer ces opérations pour que l'effet obtenu soit bénéfique. Pour cela, mieux vaut donc prévoir légèrement avant le changement que celui-ci aura lieu et alors modifier will-change en prévision.
    
+  
    Laisser le temps à will-change pour qu'il fonctionne. Cette propriété est conçue pour permettre aux auteurs d'indiquer à l'agent-utilisateur les propriétés qui vont probablement changer afin que le navigateur puisse optimiser en avance de phase. Il est donc important de laisser le temps au navigateur d'appliquer ces opérations pour que l'effet obtenu soit bénéfique. Pour cela, mieux vaut donc prévoir légèrement avant le changement que celui-ci aura lieu et alors modifier will-change en prévision.
    
  
    • 
  
  • 
-  
    Sachez que will-change peut modifier l'apparence des éléments lorsqu'il est utilisé avec des propriétés qui créent des contextes d'empilement (par exemple will-change: opacity) car le contexte d'empilement est créé au préalable.
    
+  
    Sachez que will-change peut modifier l'apparence des éléments lorsqu'il est utilisé avec des propriétés qui créent des contextes d'empilement (par exemple will-change: opacity) car le contexte d'empilement est créé au préalable.
    
  
    • 
 

 
@@ -75,14 +75,14 @@ will-change: unset;
 
 
Exemples

 
-
.sidebar {
+
.sidebar {
   will-change: transform;
 }
 

 
 
Dans l'exemple précédent, on applique la propriété will-change à même la feuille de style. Dans ce cas, le navigateur conservera l'optimisation en mémoire beaucoup plus longtemps que nécessaire. Nous avons vu précédemment que cela devait être évité et voici donc un deuxième exemple qui illustre comment appliquer la propriété will-change grâce à JavaScript (et qui correspond donc à la méthode qui devrait être utilisée la plupart du temps) :

 
-
var el = document.getElementById('element');
+
var el = document.getElementById('element');
 
 // On applique will-change quand la souris/curseur
 // pointeur/stylet passe au-dessus de l'élément
@@ -101,7 +101,7 @@ function removeHint() {
 
 
Cela peut toutefois être pertinent d'inclure will-change dans la feuille de style d'une application qui gère des changements de pages ou des diapositives parmi lesquelles on navigue lorsque les pages sont complexes. Cela permettra au navigateur de préparer la transition en avance de phase et de mieux réagir au changement de page (ou de diapositive) lorsque le bouton associé sera utilisé.

 
-
.slide {
+
.slide {
   will-change: transform;
 }

 
-- 
cgit v1.2.3-54-g00ecf