Background image on Phonegap causes incredible slowness? <p>So after much frustration, I finally pin-pointed the problem. The following causes severe decline in speed in my phonegap app:</p> <pre><code>body.default { background: #000000 url(../img/background.jpg) no-repeat center top fixed; background-size: cover; } </code></pre> <p>The image was 1500 x 1500 pixels and about 350Kb. I optimized it a bit and decreased the dimensions to 1000 x 1000. This resulted in a final size of 106Kb. </p> <p>The problem is, even when I make it smaller like this, it still slows down the app considerably. However if I have this:</p> <pre><code>body.default { background: none; background-size: cover; } </code></pre> <p>Then the speed is nice and fast. So I know the background is causing the slowness.</p> <p>What can I do to still show a good quality as the background, without killing performance?</p> <p><strong>UPDATE</strong></p> <p>I've managed to get an "ok" result if I decrease the image size to 36 kb. Of course, then I loose a lot of the quality, but it has an overlay, so it's not that noticeable. However, I think that it might be background-size: cover, that might be inefficient, but I haven't tested that yet. I will keep trying...</p>