Android：WebView 提高本地 html 文件的加载速度答案

【问题标题】：Android: WebView improve loading speed of local html FilesAndroid：WebView 提高本地 html 文件的加载速度
【发布时间】：2016-08-03 06:38:48
【问题描述】：

有没有办法提高将本地.html 文件加载到WebView 中的速度。 .html 文件存储在/assets 文件夹中。

正如您在视频中看到的（抱歉，链接已损坏！），TextView（红色背景）在过渡开始之前呈现，而 WebView 中的文本显示然后。我怎样才能实现像 TextView 一样快地加载 WebView？

//current implementation
webView.setInitialScale(1);
webView.getSettings().setJavaScriptEnabled(true);
webView.getSettings().setLoadWithOverviewMode(true);
webView.getSettings().setUseWideViewPort(true);
webView.setScrollBarStyle(WebView.SCROLLBARS_OUTSIDE_OVERLAY);
webView.setScrollbarFadingEnabled(false);

webView.loadUrl("file:///android_asset/disclaimer.html");

摘要

这是不可能的。我在这里尝试了所有的 cmets 并没有什么不同。

我问的原因是，我们有一个适用于 iOS 和 Android 的应用程序，主要由简单的TextViews 和Images 组成。所以我们产生了创建本地 html 文件的想法，我们可以在两个应用程序中使用这些文件。在iOS 这就像一个魅力，但在Android 我们无法摆脱加载时间，所以我总是有一个空白屏幕，100-200 毫秒后出现内容。

如果 Activity 可见，我猜 Androids WebView 会开始渲染。这在在线模式 中完全有意义，因为您不想在用户真正关注它们之前加载多个 html 页面，这些页面是用户在后台通过新的点击打开的。但是，在离线模式（存储在应用程序assets 中的本地html 文件）此行为是不必要的，但您无法更改它。

现在我们真的知道为什么 phonegap & co 很烂了。

仅作记录：最后，我使用了一个带有空 LinearLayout 容器的活动，您可以在其中以编程方式插入内容。每种样式（标题 1、标题 2、内容...）都有自己的布局 xml 文件

public void insertHeadline(int id){

    String text = getString(id);
    TextView headline = (TextView) inflater.inflate(R.layout.layout_text_headline, null, false);
    headline.setText(text);

    //add this TextView to the empty container
    myLinearLayoutContainerView.addView(headline);

}

【问题讨论】：

标签： android html performance android-webview android-assets

【解决方案1】：

WebView 的渲染时间总是比原生 TextView 长。我认为这是平台的本质，但也许您可以尝试在加载屏幕之前将 html 内容读取到字符串（以避免文件系统操作中的 webview）。然后将字符串设置为：

webview.loadDataWithBaseURL("", earlyReadedHtmlString, "text/html", "UTF-8", "");

理论上，这对于 webview 来说必须更快更公平。另一种方法是等待 onPageFinished() 然后显示 textview。这可能是一种解决方法。

【讨论】：

【解决方案2】：

资产访问速度很慢，因为它们包含在 apk 文件中，该文件本质上是一个美化的 zip 文件。

我会编写一个启动例程，它只是从资产中获取文件并将它们写入内部存储（如果它们很大并且不包含敏感数据，则将它们写入外部存储。

从 apk 的资产中提取它们后，访问它们的速度要快得多。

【讨论】：

能否请您发布如何在别处复制资产？

【解决方案3】：

无论您打开/关闭多少个开关以及您尝试了多少优化和调整，webview 都无法像 textview 那样快速渲染（除非您真的在滥用 textview，例如加载数千行文本）。呈现机制有利于文本视图，因为它在如何指定对其正常呈现的更改方面受到更多限制，因为 webview 可以加载外部资源，因为 css 修改呈现，因为 javascript 可以影响呈现，因为它需要更多的内存和初始化来支持所有这些功能，...

这就是为什么 phonegap/cordova 应用程序不能像原生应用程序那样活泼和互动的原因。好吧，除非本机应用程序仅由 webviews 组成：P

您仍然可以尝试通过修改其配置来改进 webview 的加载/渲染时间，但您最好等到您的内容被定义。所有这些设置都允许在特定情况下进行改进，例如，更改图层类型可能有助于或缩短不同页面的渲染时间。正如 Nirmal 在他的回答中提到的，一些已知的影响更大的是 layerType、cacheMode 和 renderPriority

我认为很难，您想要实现的是防止您的用户看到不完整的屏幕。您可以使用 onPageFinished 在显示屏幕之前渲染一个 webview，但它不会加载得更快，用户必须等待更长时间直到屏幕转换，并且您可能需要一个旋转轮。

根据我的经验，您实现转换的方式是更好的用户体验，我会等到您定义好 html 内容后再尝试优化加载时间。

如果您已经发现当前的体验已经很烦人，我会考虑删除所有 html 内容/网页视图。

【讨论】：

【解决方案4】：

这取决于正在加载的 Web 应用程序。尝试以下一些方法：

设置更高的渲染优先级（API 18+ 已弃用）：

webview.getSettings().setRenderPriority(RenderPriority.HIGH);

启用/禁用硬件加速：

if (Build.VERSION.SDK_INT >= 19) {
// chromium, enable hardware acceleration
webView.setLayerType(View.LAYER_TYPE_HARDWARE, null);
} else {
   // older android version, disable hardware acceleration
   webView.setLayerType(View.LAYER_TYPE_SOFTWARE, null);
}

禁用缓存：

webview.getSettings().setCacheMode(WebSettings.LOAD_NO_CACHE);

【讨论】：