Next 14 shows flicker with external React Native components on web

[bitter rock]

Hello Next community,

We have been trying to use react native components with Next14 and observing flickers. Link to the code that reproduces this issue

https://github.com/soniankur948/RN-flicker
To Reproduce

npm run dev
go to http://localhost:3000
we observe a flicker

Current vs. Expected behavior
Bug Report

Description:

Following the steps in the previous section, I expect styled components to render correctly. However, I observe unstyled components on the page initially. These components only get styled after the <style id="react-native-stylesheet"></style> tag is added to the head, causing a noticeable flicker. This issue is particularly evident when slowing the speed using network throttling.

Github issue for same - https://github.com/vercel/next.js/issues/66880

Flicker experience - https://tinyurl.com/4fky32pm

Has anyone experienced similar issue?

Thanks

[opal nimbus]

Post created!

🔎 This post has been indexed in our web forum and will be seen by search engines so other users can find it outside Discord

🕵️ Your user profile is private by default and won't be visible to users outside Discord, if you want to be visible in the web forum you can add the "Public Profile" role in id:customize

✅ You can mark a message as the answer for your post with Right click -> Apps -> Mark Solution
(if you don't see the option, try refreshing Discord with Ctrl + R)