Reducing textures to minimize excessive load is a key strategy. Starting with smaller textures at the source can greatly enhance performance downstream.
Even though this post is dated, it still appears as a top search result on Google. Here are some valuable tips for beginner 3D game/web developers.
Textures are processed in fixed bit chunks, so fewer chunks mean better efficiency. Creating textures with resolutions that are powers of two helps avoid loading incomplete chunks and wasting resources. Following this pattern prevents data loss.
Consider the actual size of your texture on the screen. If your original image is 1024x1024 but only occupies a small portion of the screen or output canvas, all the extra detail is unnecessary. Scale down your textures to match their on-screen appearance.
If certain colors in your textures are not being utilized, consider using vertex coloring or lighting effects instead. For such cases, save your texture as grayscale or limit the color palette by indexing them.
.gif format works well for smaller textures, while JPEG is more effective for compressing larger ones. With .gif files, you can also conserve space by combining multiple textures into one image and matching them with a shared palette. Keep in mind that classics like Zelda LTTP operated using just 256 colors. Utilizing an RGB index array and storing images as raw numbers can be efficient.
When importing/exporting images from JSON, remember that images default to raw 32-bit PNG files. These large files become even bigger when embedded as raw data in a JSON object. Consider exporting only mesh data and reapplying the texture via JavaScript in your source code to optimize various formats and textures.