I have been exploring the Next.js official docs about the UI Streaming feature they have added, They clearly mention that this feature does not affect SEO, but I was wondering what does the crawler see when it visits my page and which part will be included in the SEO? Does it wait for the UI streaming to finish or it just sees the ready-to-serve html that is initially sent from the server to the client?

Given the example below I am wondering that is the page source and the serialized html the crawlers see when they visit our page. Is it the p tag with the placeholder for the suspensed component or is it the end result of the UI streaming?

Is there any way or tool to ensure locally for projects that are not deployed yet?

const HomePage = async () => {
  return (
    <>
      <p>ready to serve html content does not any data to be fetched...</p
      <Suspense fallback={<div>loading...</div>}>
        <Cards /> {// this component performs an async action}
      </Suspense>
    </>
  );
};

export default HomePage;