Leaflet: Avertissement de la console Firefox : la consommation de mémoire Will-change est trop élevée.

Créé le 29 juin 2016  ·  12Commentaires  ·  Source: Leaflet/Leaflet

Je viens de changer en Leaflet 1.0.0-rc1 dans mon application de carte et j'ai reçu l'avertissement suivant dans la console pour Firefox 47.0 pour Ubuntu 16.04.

Will-change memory consumption is too high. Budget limit is the document surface area multiplied by 3 (1535100 px). Occurrences of will-change over the budget will be ignored.

Commentaire le plus utile

Je ne suis pas convaincu que ce soit en fait un problème de Leaflet.

Leaflet indique au navigateur les modifications qu'il apportera au DOM (transformations et transitions d'opacité), en utilisant la propriété CSS will-change . Peu importe ce que le navigateur fait avec cette astuce, nous _utiliserons_ des transitions pour animer l'opacité et transformer les tuiles.

Dans ce cas, Firefox nous informe qu'il pense que ses optimisations pour will-change consommeraient trop de mémoire et l'ignoreraient, ce qui est bien.

La raison pour laquelle vous rencontrez ce problème après la mise à niveau vers Leaflet 1.0 est que will-change n'était pas du tout utilisé dans les versions antérieures de Leaflet.

Je n'ai pas profilé Leaflet avec et sans l'indice will-change , mais mon interprétation est que nous l'utilisons plus ou moins exactement comme décrit ici : https://developer.mozilla.org/en/docs/Web/ CSS/will-change - la seule vraie alternative serait de retravailler complètement la façon dont les transitions sont gérées - en soi un refactor majeur - et au moins la dernière fois que nous avons comparé, les transitions CSS surpassaient toujours les transitions implémentées en JavaScript.

Je ferme ceci pour le moment, car je ne vois pas ce que Leaflet peut faire à ce sujet, mais n'hésitez pas à ajouter des suggestions et nous envisagerons de rouvrir.

Tous les 12 commentaires

Salut @radumas , nous venons de rencontrer ce problème également. Il semble que ce soit un problème de navigateur qui a peut-être été résolu depuis que vous avez publié ce problème. Pouvez-vous tester à nouveau dans la dernière version de Firefox (51) et nous faire savoir si cela se produit toujours ?

Salut @seadour. Je suis allé à la même page dans Firefox 51.0.1 (64-bit) sur Ubuntu 16.04 et le même avertissement est apparu dans la console. Faites-moi savoir s'il y a autre chose que je peux aider!

Merci d'avoir essayé. Avez-vous mis à niveau vers Leaflet 1.0.3 ? Si c'est le cas, la page est-elle quelque part publique où nous pouvons la tester, ou pouvez-vous publier un échantillon en tant que plunkr/jsfiddle pour nous ?

Je n'ai pas encore mis à jour ! Mais je le ferai et je vous ferai savoir si cela change quelque chose. La carte est également :point_up:, bien que ce ne soit pas particulièrement simple.

Ça a l'air bien. J'obtiens la même erreur sur votre page avec Firefox 51 pour Mac. (au fait, belle application !)

Je ne suis pas convaincu que ce soit en fait un problème de Leaflet.

Leaflet indique au navigateur les modifications qu'il apportera au DOM (transformations et transitions d'opacité), en utilisant la propriété CSS will-change . Peu importe ce que le navigateur fait avec cette astuce, nous _utiliserons_ des transitions pour animer l'opacité et transformer les tuiles.

Dans ce cas, Firefox nous informe qu'il pense que ses optimisations pour will-change consommeraient trop de mémoire et l'ignoreraient, ce qui est bien.

La raison pour laquelle vous rencontrez ce problème après la mise à niveau vers Leaflet 1.0 est que will-change n'était pas du tout utilisé dans les versions antérieures de Leaflet.

Je n'ai pas profilé Leaflet avec et sans l'indice will-change , mais mon interprétation est que nous l'utilisons plus ou moins exactement comme décrit ici : https://developer.mozilla.org/en/docs/Web/ CSS/will-change - la seule vraie alternative serait de retravailler complètement la façon dont les transitions sont gérées - en soi un refactor majeur - et au moins la dernière fois que nous avons comparé, les transitions CSS surpassaient toujours les transitions implémentées en JavaScript.

Je ferme ceci pour le moment, car je ne vois pas ce que Leaflet peut faire à ce sujet, mais n'hésitez pas à ajouter des suggestions et nous envisagerons de rouvrir.

Ce "problème" est toujours actif avec la dernière version de firefox/leaflet.

Est-il possible d'ajouter une option dépliant pour désactiver complètement l'indice will-change ?

MDN recommande que la propriété soit utilisée en dernier recours pour les problèmes de performances existants plutôt que ceux que vous prévoyez. Et, lors de son utilisation, il est recommandé d'activer le changement juste avant qu'un élément ou une propriété ne change, puis de le désactiver à nouveau peu de temps après la fin du processus.

@jormun-pluxml, vous pouvez facilement le remplacer par une règle CSS.

Merci, c'est ce que j'ai finalement fait :)

@jormun-pluxml, vous pouvez facilement le remplacer par une règle CSS.

Pouvez-vous s'il vous plaît décrire comment utiliser la règle CSS will-change à utiliser pour contrer ce problème, je suis confronté au problème similaire dans lequel ma console reçoit ce message lors de l'utilisation de la brochure pour afficher les fichiers de formes du serveur local

```
La consommation de mémoire Will-change est trop élevée. La limite budgétaire est la surface du document multipliée par 3 (705024 px). Les occurrences de changement de volonté par rapport au budget seront ignorées

j'ai fait ça :
.leaflet-fade-anim .leaflet-tile,.leaflet-zoom-anim .leaflet-zoom-animated { will-change:auto !important; }

Je n'ai pas profilé Leaflet avec et sans l'indice de changement de volonté, mais mon interprétation est que nous l'utilisons plus ou moins exactement comme décrit ici : https://developer.mozilla.org/en/docs/Web/CSS/will -monnaie

Il correspondait à cette page au moment de la publication de ce commentaire, mais notez qu'il a maintenant

Important : will-change est destiné à être utilisé en dernier recours, afin d'essayer de résoudre les problèmes de performances existants. Il ne doit pas être utilisé pour anticiper des problèmes de performances.

boîte ajoutée dans https://developer.mozilla.org/en-US/docs/Web/CSS/will-change $compare?locale=en-US&to=1392790&from=1342858 modifier

Cette page vous a été utile?
0 / 5 - 0 notes