Menu
I'm building a SPA (Single Page Application) using KO. the application looks like a book and the user can flip pages.
The problem is that every time a page loads, there is a short moment where the page 'flickers' and the user sees the unstyled version of the page. I guess this is caused due to the fact that a lot of the styling is dependant on ko bindings so until ko finishes it 'magic' the user gets a glimpse of the unstyled code.
Is it possible to tell when KO finished all its bindings and only then show the page?
I've managed to partially solve it by setting a timeout before loading the view but of course this is not a good solution.
356
By default, the javascript / jQuery code you write is executed at Document ready. This means that the whole page is loaded before your changes are made. This can sometimes cause “flickering”. You can avoid this by changing the way Symplify executes javascript / jQuery.
applyBindings do, The first parameter says what view model object you want to use with the declarative bindings it activates. Optionally, you can pass a second parameter to define which part of the document you want to search for data-bind attributes. For example, ko.
Knockout is a JavaScript library that helps you to create rich, responsive display and editor user interfaces with a clean underlying data model.
Yes, it is very easy actually. Apply display:none to the top level div (or w/e container), and data-bind="visible: true". This will cause the page to be hidden until knockout unhides it via binding (which obviously can't happen until its fully loaded).
Since you are using a non-observable value, Knockout won't even bother to re-check this again. There shouldn't be a performance concern after the initial binding.
192
I think this was answered better previously by using templates.
What is the best way to hide the screen while knockout js bindings are being built?
32
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
