Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: don't dynamically load the app adapter (prevent blank flash) #97

Merged
merged 2 commits into from
Oct 3, 2019

Conversation

amcgee
Copy link
Member

@amcgee amcgee commented Oct 2, 2019

I switched the AppAdapter to a React.Lazy component a while back. This has the advantage of code-splitting the bundle, so that we can analyze what's in the adapter vs the shell itself. However, it had the consequence of causing the Headerbar to wait until the entire application has loaded before rendering. This meant that, for applications with moderate bundle sizes like the Query Playground and also in low-bandwidth situations the entire page would flash "blank white" for a noticeable duration.

This change reverts the Adapter code-splitting, so that the shell displays the adapter (including the headerbar) on first render. It also adds displays full-page screen cover and loading spinner while the app bundle loads, rather than an empty div. You can test this behavior by setting "slow 3g" in dev tools. Note that there is also a loading spinner displayed while the AuthBoundary loads its data - we'll want to consolidate these once we have either first-class suspense for data loading (from React) or implement a LoadingBoundary ourselves (using Context)

@amcgee amcgee requested a review from varl October 2, 2019 21:11
@netlify
Copy link

netlify bot commented Oct 2, 2019

Deploy preview for dhis2-app-platform ready!

Built with commit 9c9544a

https://deploy-preview-97--dhis2-app-platform.netlify.com

Copy link
Contributor

@varl varl left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

What's the yarn.lock change about?

@varl
Copy link
Contributor

varl commented Oct 3, 2019

Other than the yarn.lock change this is for the best. Having the header bar visual early is a nice trait.

@amcgee
Copy link
Member Author

amcgee commented Oct 3, 2019

@varl the yarn.lock changes are in examples/simple-app and come from this line

Basically because the dep is a file dependency, the yarn.lock changes there are delayed until after a release (version bump)

@varl
Copy link
Contributor

varl commented Oct 3, 2019

Interesting. Thanks!

@varl varl merged commit 5d2d491 into master Oct 3, 2019
@varl varl deleted the fix/static-adapter branch October 3, 2019 08:53
dhis2-bot added a commit that referenced this pull request Oct 3, 2019
## [1.5.2](v1.5.1...v1.5.2) (2019-10-03)

### Bug Fixes

* don't dynamically load the app adapter (prevent blank flash) ([#97](#97)) ([5d2d491](5d2d491))
@dhis2-bot
Copy link
Contributor

🎉 This PR is included in version 1.5.2 🎉

The release is available on:

Your semantic-release bot 📦🚀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants