Flickering issue on initial render

[cooltaiwanesesam]

trafficstars

This is a great lightweight package. But the package is currently set a default columns and gap to 1, which on Next.js it results to flickering on initial render.

const [values, setValues] = React.useState({ columns: 1, gap: 1 });

Will you consider adding additional support to use User-Agent header as a proxy to set the default columns and gap if it's available to minimise the flicker, then having useEffect to update once the window object is available?

[askides]

Hello @cooltaiwanesesam, i currently fixed the issue in the latest version, Basically i prevent rendering to avoid the flickering. There's a working example using Next.js 14 here: https://react-plock-with-nextjs.vercel.app/.

I think this will solve also your problem.

Let me know!

[github-actions[bot]]

This issue has been automatically closed due to inactivity. If you still have further updates, please feel free to reopen or create a new issue.