Trying to use gif file in lightning app but have no luck to see working, any idea how it can be done?
I haven’t tried this myself but I’ve also been curios as if the gif plays at all. Did you try inserting the image via the src property or through the Img plugin?
Lightning is rendering on canvas via WebGL(in primary rendering mode, if a WebGL context is available). It means all the images you are seeing are rendered as sprites, i.e. textured quads composed from polygons, and this output is generated via GPU. It differs from a regular way how browsers are rendering content, for example the img node you may use to display a GIF image.
In case if you want to render an animation sequence, you will need to load all the frames into GPU memory and then display them one by one. Of course, you may decode GIF on a fly, extract frames, and upload them into GPU via Blob, but it’s not a very efficient way. Instead you may refer to technique called Texture Atlas that allows to place all animation frames into a single texture and “animate” the image by changing of texture coordinates.
Texture atlas could be used not only for animation, but as an optimization technique(for example, you may pack all you app’s icons into a single texture which will reduce context switches amount), or you may even super-efficiently render huge amounts of text with their help.
1 Like