Skip to content

NextJS - Refresh glitch with components in the TetrislyProvider #149

@elvisdcgoncalves

Description

@elvisdcgoncalves

Hi,

I have a NextJS proof of concept starter project.

I have added Tetrisly to this project, on 2 separate pages.

On each page i simply display Tetrisly components H1 and Button and they display just fine, but if i hit the refresh button of the browser (Chrome) you can see that the components are rendered unstyled for half a second and then the Tetrisly styles are applied.

If you then navigate between the 2 pages using the buttons on the page, you do not see this visual glitch because of how NextJS loads a page using the Link component.

On the second page (/test), i have also added MuiButtons and they render fine on a browser refresh, but the Tetrisly components are rendered unstyled first and the styles once the refresh of the page is completed.

Here is a link to my public github repo to reproduce this issue: https://github.com/elvisdcgoncalves/poc-tetrisly

Thank you in advance for your help!

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions