Re: [chromium-dev] Preloading webview (when webview in not visible)

[Bo Liu]

+android-webview-dev

Loading content into the webview is independent of rendering the webview. You can create a detached webview, load content into it, then attached it to the view tree after the onPageFinished callback.

On Wed, Nov 26, 2014 at 10:35 AM, Mahabudhi <sai.m...@gmail.com> wrote:

I have been playing with Chromium based WebView (KitKat 4.4.4), I am unable to preload webview with local content (content from the same device). I browsed through 'stackoverflow' and figured out 'if I put WebView' as a child of 'ViewFlipper' it does load web pages (which are not local on the device, external web pages).

Can any one of you point me in the right direction to achieve this? My use case is 'I have bunch of HTML/CSS/Images' local on the device, would like to load them into webview before user bring the webview into the view.

Thanks

MB

--
--
Chromium Developers mailing list: chromi...@chromium.org
View archives, change email options, or unsubscribe:
http://groups.google.com/a/chromium.org/group/chromium-dev

[Mahabudhi]

Bo Liu, thanks for your reply. Probably I should reframe my question as 'pre-rendering', the issue is when my WebView comes into 'view' (user visibility) then it starts rendering the content (e.g. images that I loaded into webview). This leaves a bad user experience, is there a way to avoid this. (when I used ViewFlipper technique to load webpages like google.com, that content is preloaded into webview and rendered too, so user experience is pretty good).

Thanks

MB

[Mikhail Naganov]

Maybe you can put your WebView off-screen? E.g. GMail opens 3 WebViews: for the previous, current, and the next message, positioned in a row, with only the current message inside the screen coordinates. This allows them to pre-load and pre-render the content of the messages before you view them.

--
You received this message because you are subscribed to the Google Groups "android-webview-dev" group.
To unsubscribe from this group and stop receiving emails from it, send an email to android-webview...@chromium.org.
To post to this group, send email to android-w...@chromium.org.
To view this discussion on the web visit https://groups.google.com/a/chromium.org/d/msgid/android-webview-dev/a547ded1-f8db-4ad4-9a3b-ed7e83be497e%40chromium.org.

[Bo Liu]

Webview (and chrome) prefers to stay responsive to user input over drawing every frame 100% correctly. This means you can see "incomplete" frames with tiles missing etc. And the rendering pipeline is optimized to hide these incomplete frames from normaly human user interactions. More info about this here: http://www.chromium.org/developers/design-documents/impl-side-painting

But all these details is pretty much a black box that the embedding app cannot control. I suspect the reason google.com appears "pre-rendered" is only because it's a light weight page so you didn't see any incomplete frames.

There are some tricks/hacks you can do, mainly in the "use webview like a human user would use a browser" category. So avoid resizing webviews or moving webviews inside the android view tree. Keep webview attached if you want it to stay in hardware mode (uses more memory, so don't keep too many attached). If you need to hide a webview, just call setVisbility(INVISIBLE), which surprisingly has no effect on chromium-side rendering pipeline. There is no "content rendered" signal to unhide the webview, but hopefully something like onPageFinished would be good enough for you in most cases.

On Wed, Nov 26, 2014 at 12:53 PM, Mikhail Naganov <mnag...@chromium.org> wrote:

Maybe you can put your WebView off-screen? E.g. GMail opens 3 WebViews: for the previous, current, and the next message, positioned in a row, with only the current message inside the screen coordinates. This allows them to pre-load and pre-render the content of the messages before you view them.

Pre-render doesn't really happen when the webviews are offscreen. It happens in lock step when the messages is side-swiped into view, which is why incomplete frames can still happen if that side-swipe animation is too fast for the rendering to keep up.

[Mahabudhi]

Mikhail,

      I followed that and then encountered this issue. Here is what I did exactly

      - Created three webviews
      - Loaded different images into three webviews at the same time(very high resolution images, when viewed scaling them to screen size using CSS)
      - Put all three into ViewFlipper
      - When user sees the first webview it appears as if it is loading the image
      - wait for 3 to 5 seconds even longer (hoping other images should have been loaded into other webviews)
      - when user flips the first web view to look at second one, it is not loaded into view at all and when this second webview comes into view it starts loading image(the same experiment with external websites has different experience one can see web site completely loaded)

Thanks

MB

On Wednesday, 26 November 2014 12:54:37 UTC-8, Mikhail Naganov wrote:

Maybe you can put your WebView off-screen? E.g. GMail opens 3 WebViews: for the previous, current, and the next message, positioned in a row, with only the current message inside the screen coordinates. This allows them to pre-load and pre-render the content of the messages before you view them.

On Wed, Nov 26, 2014 at 6:56 PM, Mahabudhi <sai.m...@gmail.com> wrote:

Bo Liu, thanks for your reply. Probably I should reframe my question as 'pre-rendering', the issue is when my WebView comes into 'view' (user visibility) then it starts rendering the content (e.g. images that I loaded into webview). This leaves a bad user experience, is there a way to avoid this. (when I used ViewFlipper technique to load webpages like google.com, that content is preloaded into webview and rendered too, so user experience is pretty good).

Thanks

MB

On Wednesday, 26 November 2014 10:44:34 UTC-8, Bo Liu wrote:

+android-webview-dev

Loading content into the webview is independent of rendering the webview. You can create a detached webview, load content into it, then attached it to the view tree after the onPageFinished callback.

On Wed, Nov 26, 2014 at 10:35 AM, Mahabudhi <sai.m...@gmail.com> wrote:

I have been playing with Chromium based WebView (KitKat 4.4.4), I am unable to preload webview with local content (content from the same device). I browsed through 'stackoverflow' and figured out 'if I put WebView' as a child of 'ViewFlipper' it does load web pages (which are not local on the device, external web pages).

Can any one of you point me in the right direction to achieve this? My use case is 'I have bunch of HTML/CSS/Images' local on the device, would like to load them into webview before user bring the webview into the view.

Thanks

MB

--
--
Chromium Developers mailing list: chromi...@chromium.org
View archives, change email options, or unsubscribe:
http://groups.google.com/a/chromium.org/group/chromium-dev

--
You received this message because you are subscribed to the Google Groups "android-webview-dev" group.

To unsubscribe from this group and stop receiving emails from it, send an email to android-webview-dev+unsub...@chromium.org.

To unsubscribe from this group and stop receiving emails from it, send an email to android-webview-dev+unsub...@chromium.org.

To post to this group, send email to android-w...@chromium.org.

[Mahabudhi]

Bo,
   I just used 'google.com' as example but I used some other sites like news.bbc.co.uk etc and waited for few seconds, then I do see it was completely loaded before webview came into view (what I mean here is as soon as this webview came into view, I did see whole web page was loaded and did not see any part so the page getting refreshed or loaded, very first time). Is there a difference how the content is supplied (i.e. from a webserver vs local).

thanks

MB

To unsubscribe from this group and stop receiving emails from it, send an email to android-webview-dev+unsub...@chromium.org.

To post to this group, send email to android-w...@chromium.org.

[Bo Liu]

High resolution images are expensive to decode. That's probably the bottleneck.

On Wed, Nov 26, 2014 at 1:26 PM, Mahabudhi <sai.m...@gmail.com> wrote:

Bo,
   I just used 'google.com' as example but I used some other sites like news.bbc.co.uk etc and waited for few seconds, then I do see it was completely loaded before webview came into view (what I mean here is as soon as this webview came into view, I did see whole web page was loaded and did not see any part so the page getting refreshed or loaded, very first time). Is there a difference how the content is supplied (i.e. from a webserver vs local).

No, how the content is loaded has no impact on rendering

[Mahabudhi]

Agree high res images could be problem, but if I waited for say 20 seconds before seeing the next webview this high resolution image should have been decoded right? in this local high res images cases time does not matter, when webview comes into view image gets down scaled.

Thanks

MB

To unsubscribe from this group and stop receiving emails from it, send an email to android-webview-dev+unsubscribe...@chromium.org.

To post to this group, send email to android-w...@chromium.org.

[Bo Liu]

On Wed, Nov 26, 2014 at 2:23 PM, Mahabudhi <sai.m...@gmail.com> wrote:

Agree high res images could be problem, but if I waited for say 20 seconds before seeing the next webview this high resolution image should have been decoded right?

No. If a webview is detached or offscreen, it believes it will not be rendered any time soon, so avoids wasting resources by not doing any pre-rendering. It's a lot like an unfocused chrome tab.

The actual implementation is a lot more subtle but this is a good mental model. And like I said, rendering is a black box that apps can't directly control.

[Mahabudhi]

Got it, thank you. But is there any other technique that I can use so that when webview comes into 'view' all the images are rendered (you gave a clue, bringing webview animation can be slower, so that it gets enough time to render). I am using 'loadDataWithBaseURL' to load my local images.

Only thing that is unanswered in my mind is, this behavior is not seen with external websites. The longer I wait more complete website I view. In this case too it needs to resize images to fit to my screen etc right, but webview is doing work.

In both cases my webviews are part of UI hierarchy they are not detached.

Thanks

MB

[Bo Liu]

On Wed, Nov 26, 2014 at 3:03 PM, Mahabudhi <sai.m...@gmail.com> wrote:

Got it, thank you. But is there any other technique that I can use so that when webview comes into 'view' all the images are rendered (you gave a clue, bringing webview animation can be slower, so that it gets enough time to render). I am using 'loadDataWithBaseURL' to load my local images.

Same story. Some apps use tricks like keeping the "offscreen" webview 1-pixel on screen, but behind other views, to force rendering to happen. But then that has draw costs.

You could also use a single webview and do the animation in html.

Only thing that is unanswered in my mind is, this behavior is not seen with external websites. The longer I wait more complete website I view. In this case too it needs to resize images to fit to my screen etc right, but webview is doing work.

Are you confusing rendering with loading? Normal webpages hit the network and probably takes some time to load, but a lot less to render than giant images.

[Saikumar Majeti]

Thanks a lot, got it.

Regards

MB

--

Thank you,

Sai Majeti