Oops, fix a perf regression in Hi-Res Mode!

Ah oops, because I forgot to set `hiResMode` here in the image preloader, we would preload the PNG, and _then_ load the SVG separately.

This doubled the effective image loading time in Hi-Res Mode!

Now, the image preloader respects hi-res mode, and will preload the SVG in the SVG case, and the PNG in the PNG case.
This commit is contained in:
Emi Matchu 2021-06-11 05:52:53 -07:00
parent 2375669cdf
commit 07bf555a02

View file

@ -325,6 +325,8 @@ export function getBestImageUrlForLayer(layer, { hiResMode = false } = {}) {
* all the new layers are ready, then show them all at once!
*/
export function usePreloadLayers(layers) {
const [hiResMode] = useLocalStorage("DTIHiResMode", false);
const [error, setError] = React.useState(null);
const [loadedLayers, setLoadedLayers] = React.useState([]);
const [layersHaveAnimations, setLayersHaveAnimations] = React.useState(false);
@ -360,10 +362,12 @@ export function usePreloadLayers(layers) {
})
);
} else {
return loadImage(getBestImageUrlForLayer(layer)).then((image) => ({
type: "image",
image,
}));
return loadImage(getBestImageUrlForLayer(layer, { hiResMode })).then(
(image) => ({
type: "image",
image,
})
);
}
});
@ -404,7 +408,7 @@ export function usePreloadLayers(layers) {
return () => {
canceled = true;
};
}, [layers, loadedLayers.length, loading]);
}, [layers, loadedLayers.length, loading, hiResMode]);
return { loading, error, loadedLayers, layersHaveAnimations };
}