# How to update gr.Image without flickering?

**URL:** <https://discuss.huggingface.co/t/how-to-update-gr-image-without-flickering/60095>\
**Category:** 🔒 Gradio\
**Created:** [October 27, 2023, 12:56am UTC](https://discuss.huggingface.co/t/how-to-update-gr-image-without-flickering/60095 "2023-10-27T00:56:22Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![lgzhang](https://avatars.discourse-cdn.com/v4/letter/l/90db22/32.png) [@lgzhang](https://discuss.huggingface.co/u/lgzhang)\
**Post date:** [October 27, 2023, 12:56am UTC](https://discuss.huggingface.co/t/how-to-update-gr-image-without-flickering/60095/1 "2023-10-27T00:56:22Z")

</div>

Currently whenever a gr.Image object gets a new image, it turns white temporarily before updating the image. Can we disable that effect? It’s okay if the displayed image stays unchanged for a while but the flickering is distracting. Thanks!

Example code looks like this. Whenever the gen\_image method has a large delay, the image turns white temporarily.

```auto
import gradio as gr
import numpy as np
import time

def gen_image(x, state):
    time.sleep(0.05)
    return np.zeros((100, 100, 3), dtype=np.uint8) + int(x * 255)

with gr.Blocks() as demo:
    slider = gr.Slider(0, 1, step=0.1)
    img0 = gen_image(0, None)

    img = gr.Image(
        type="numpy", value=img0, height=img0.shape[0], width=img0.shape[1]
    )

    slider.change(gen_image, slider, img, api_name="predict")
    
if __name__ == " __main__":
    demo.launch()   

```

---

<div class="post-metadata">

**Author:** ![andreped](https://sea2.discourse-cdn.com/hellohellohello/user_avatar/discuss.huggingface.co/andreped/32/33289_2.png) [@andreped](https://discuss.huggingface.co/u/andreped)\
**Post date:** [October 31, 2023, 3:18pm UTC](https://discuss.huggingface.co/t/how-to-update-gr-image-without-flickering/60095/2 "2023-10-31T15:18:54Z")

</div>

Thanks for opening this discussion, @lgzhang!

A solution to this issue would be of interest to me as well :]
