中サイズ (~500kb) の一連の画像を表示する iPad (雑誌) Web アプリケーションがあります。ビュー (1024x768) ごとに 1 つ表示され、スワイプすると別のビューが表示されます。
他の画像がdisplay:noneで非表示になっている間、同時にdisplay:blockとして3つの画像(前、現在、次)があります。
すべてがある程度うまく機能します。ただし、アプリケーションがしばらく実行され、より大きなセット (20 以上) の画像が表示されると、主に iPad 1 でアプリケーションがクラッシュします。これは、デバイスのメモリ消費と関係があると思います。
私の質問は、メモリ消費をできるだけ低く抑えるためのベストプラクティスは何ですか? 明らかに画像を display:none に設定しても機能しません。DOM から画像を削除し、表示されたときに再適用する必要がありますか? または、アプリケーションのクラッシュを防ぐための他の簡単なトリックはありますか?