Temporary workaround to prevent 1st frame from being dropped during streaming.

app.py

# Image / Stream
# Display an image and continuously update it in real time.
# ---
import io
import time
import uuid

import cv2
from h2o_wave import app, Q, ui, main
import numpy as np

frame_count = 256


def create_random_image(bgr):
    frame = np.zeros((512, 512, 3), dtype=np.uint8)
    frame[0:-1, 0:-1] = bgr
    _, img = cv2.imencode('.jpg', frame)
    return io.BytesIO(img)

@app('/demo')
async def serve(q: Q):
    # Mint a unique name for our image stream
    stream_name = f'stream/demo/{uuid.uuid4()}.jpeg'

    # Send image
    endpoint = await q.site.uplink(stream_name, 'image/jpeg', create_random_image([255, 0, 0]))

    # Display image
    q.page['qux'] = ui.form_card(box='1 1 4 7', items=[ui.image('Image Stream', path=endpoint)])
    await q.page.save()

    for i in range(0, 3):
        d = {
          0: [[255, 0, 0], 'Blue'], 
          1: [[0, 255, 0], 'Green'], 
          2: [[0, 0, 255], 'Red'], 
        }

        # Send image (use stream name as before).
        await q.site.uplink(stream_name, 'image/jpeg', create_random_image(d[i][0]))
        print(f'{i} -> {d[i][1]}')
        await q.sleep(1)

    await q.site.unlink(stream_name)