Should video-player be a direct child of video-player-container? Help needed

Hello. I am implementing the video sdk integration to our website. I’ve started to doubt if I’m following the best practices about zoom “video-player” web component. I have a few questions:

  1. Should “video-player” be a direct (first-level) child of “video-player-container”? In other words, which html structure is better or required:
<video-player-container>
    <video-player class="remote-participant"></video-player>
    <video-player class="local-participant"></video-player>
</video-player-container>

or:

<video-player-container>
    <div class="remote-participants">
        <div class="remote-participant">
            <div class="video">
                <video-player></video-player>
            </div>
        </div>
    </div>
    <div class="local-participant">
        <div class="video">
            <video-player></video-player>
        </div>
    </div>
</video-player-container>
  1. Should there be only one “video-player-container” web component inside a web page and all “video-player” components should be put inside that single “video-player-container”?

Thank you very much!

1 Like

Hey @Simas

Thanks for your feedback.

There is no limitation that video-player should be the direct child of the video-player-container.

Just ensure that the ancestor node of video-player includes a video-player-container element. You can structure the code to best fit the use case.

Thanks
Vic

I appreciate your help! I’m making a presumption there is no limitation for number of video-player-container per page either?

Hey @Simas

no limitation for number of video-player-container per page

Yes. No limitation.

However, for better performance, we recommend attaching all video-players to a single video-player-container if possible.

Thanks
Vic