When launching a F7 (F7/Vue) project, I try to get fast to something visible on screen.
My current approach would be:
- create a (close to) empty launch screen/route (/home/), which basically shows a splash-screen
- then initialize the app
- then dissolve to the ‘real’ home-screen
So:
- in app.js I just initalize F7
- app.vue stays as empty as possible
- home.vue contains the splash-screen and then forwards to the main.vue (or whatever is the ‘real’ home-screen)
Is this the way to go, or are there some (other) best-practices how to accomplish this?
How would I delay application initalizing (or preparing data, or everything else which is a bit more time-consuming)?
I would avoid such logic with having dummy route/page to wait until data loaded. Show the actual screen at the beginning. The good way to improve perceived performance is Skeleton layouts, preloaders, progressbars, etc. But Skeleton is doing its job really great.
For example, https://bit.ly/2Ciziwz is the totally data-driven app, which loads everything on load. Check it (you may need to quickly signup as Finder). After signup, you will see home page loads a lot of data. Then refresh the page, and i guess this will be your case.
Nothing bad if user waits for fraction(s) of second, but it is better to provide interactive UI as soon as possible.
thx for your hints…
I don’t like skeleton, loaders, progresses, so I try to show something light-weight first. But I think you’re right - dummy routes are more of a hack than anything else.
I think I can squeeze out performance by adjusting the loading-sequences and load data in the background, while the UI is already visible…