Wir arbeiten an der HTML5-Anwendung für mobile Geräte (Android + iOS). Aber das große Problem ist der Speicherverbrauch - die verwendete Speichermenge steigt sehr schnell und die App wird langsam.
Was sind die besten Praktiken, Tipps, Tools, Lösungen usw. zum Bekämpfen von Speicherverlusten in HTML (JavaScript) -Anwendungen?
P.S. Wir zielen nur auf Webkit-Browser ab
In letzter Zeit gab es einige wirklich großartige Artikel zu diesem Thema. Es gibt einige wirklich überraschende Quellen der Objekterstellung, die Ihre Aufmerksamkeit nicht wirklich erregen, es sei denn, Sie sind darauf eingestellt. In der Regel besteht das Problem nicht in der Speicherbelegung, sondern in den Speicherbereinigungszyklen, die erforderlich sind, um den Speicher zu sammeln, den die App langsam verliert.
Dieser Artikel ist der beste, den ich kürzlich über das Thema gelesen habe: Ссылка
Was Tools zur Bekämpfung / Diagnose des Problems angeht, kommt Google Chrome's Speedtracer in den Sinn. Die Optimierung für Chrome garantiert natürlich nicht die Optimierung für alle Browser, aber die meisten Dinge, die zur Objekterstellung in Chrome führen, sind für die JS-Spezifikation üblich, da sie von allen Browsern implementiert wird.
Es ist wichtig zu beachten, dass RAM-Nutzung und Video-RAM-Nutzung nicht identisch sind. Eine bewährte Methode besteht darin, festzustellen, welche Teile Ihrer Benutzeroberfläche hardwarebeschleunigt sind und um sicherzustellen, dass sie klein sind (d. H. Auf einmal auf dem Bildschirm angezeigt werden). Wenn Sie riesige Scroll-Teile der Bildschirm-Hardware beschleunigt haben, erhalten Sie GPU-Tearing / Tiling und Laggy Scrolling. Sie können dies teilweise mit dem iOS-Simulator erkennen. Dieser Artikel behandelt die Idee kurz: Ссылка
Zu guter Letzt gibt es eine Menge wirklich verbreiteter Speicherleckmuster in JavaScript, auf die jeder Ingenieur von Zeit zu Zeit stößt. IBM hat eine gute Liste von ihnen. Ich kann nicht mehr als zwei Links posten, weil ich ein n00b bin, aber Sie können nach "Common JavaScript Memory Leaks" googlen und es ist wahrscheinlich das erste Ergebnis.
Einige andere nützliche Diagnosewerkzeuge in Chrome sind der Task-Manager, das Zeitleistenfenster und der Heap-Profiler.
Browser - Chrome Canary (27.0.1447.3 Kanarienvogel)
Task-Manager: Gehen Sie zu Extras - & gt; Task-Manager // Klicken Sie mit der rechten Maustaste auf den Tab "Überschriften" und aktivieren Sie "JavaScript-Speicher"
Registerkarte "Zeitleiste": Extras - & gt; Entwicklerwerkzeuge - Zeitachse // Klicken Sie auf "Aufzeichnen", führen Sie eine Interaktion aus und beenden Sie dann die Aufnahme
Heap Profiler: Extras - & gt; Entwicklerwerkzeuge - & gt; Profile // Klicken Sie auf 'Take Heap Snapshot'
Remote-Debugging
Tiefenspeicher-Profiler
"3 Snapshot" -Technik // Präsentation "Beseitigung von Speicherverlusten in Google Mail"
Tags und Links javascript android ios webkit