ios - 预加载多个本地 WebView

Question

Because I could just find some outdated information / not working solutions to my problem I decided to ask this kind of question again. (See outdated / wrong solutions:)

• WKWebView: Is it possible to preload multiple URLs?

• (Xcode, Swift) Is it possible to load multiple WKWebViews simultaneously if they are on different viewControllers?

• Swift 3, iOS 10.3 - Preload UIWebView during Launch Screen

---

我的应用程序分为一个 native 部分和一个 HTML 部分。 HTML 保存为本地文件 (index.html)，应该加载到 myWebView View 中。

@IBOutlet weak var myWebView: UIWebView!
func loadWebview() {
    let url = Bundle.main.url(forResource: "index", withExtension: "html")
    let request = URLRequest(url: url!)
    myWebView.loadRequest(request)
    myWebView.scrollView.isScrollEnabled = false
    myWebView.allowsLinkPreview = false
    myWebView.delegate = self
}

---

因为我的 DOM 树非常大，从 native 部分切换到web 部分(点击按钮)至少需要很长时间 -第一次切换 - 因为之后，我确信 webView-request 被缓存了。

关于我的问题:如何在 app init 上预加载 WebView 以避免出现白屏(可能需要 0.5 秒 - 1 秒持续时间)从 native 切换到 Web 部件时？

编辑:

WKWebView 显示滚动条而 UIWebView 没有!

使用(与 UIWebView 一样)这种样式:

::-webkit-scrollbar {
     display: none;
}

不工作并添加这些行:

webview.scrollView.showsHorizontalScrollIndicator = false
webview.scrollView.showsVerticalScrollIndicator = false

也根本不工作。

Answer 1

首先，你应该切换到WKWebView,UIWebView is no longer recommended供 Apple 使用。

其次，您可以创建一个 WebView 池，在应用程序启动时创建并要求加载这些 View 。这样，当用户切换到网络界面时， WebView 可能已经有机会完全加载。

为此你可以使用这样的类:

/// Keeps a cache of webviews and starts loading them the first time they are queried
class WebViewPreloader {
    var webviews = [URL: WKWebView]()


    /// Registers a web view for preloading. If an webview for that URL already
    /// exists, the web view reloads the request
    ///
    /// - Parameter url: the URL to preload
    func preload(url: URL) {
        webview(for: url).load(URLRequest(url: url))
    }

    /// Creates or returns an already cached webview for the given URL.
    /// If the webview doesn't exist, it gets created and asked to load the URL
    ///
    /// - Parameter url: the URL to prefecth
    /// - Returns: a new or existing web view
    func webview(for url: URL) -> WKWebView {
        if let cachedWebView = webviews[url] { return cachedWebView }

        let webview = WKWebView(frame: .zero)
        webview.load(URLRequest(url: url))
        webviews[url] = webview
        return webview
    }
}

并要求它在应用程序启动期间有时预加载 url:

// extension added for convenience, as we'll use the index url in at least
// two places
extension Bundle {
    var indexURL: URL { return self.url(forResource: "index", withExtension: "html")! }
}

webviewPreloader.preload(url: Bundle.main.indexURL)

第三，您可能需要在 Controller 中使用容器 View 而不是实际的 Web View :

@IBOutlet weak var webviewContainer: UIView!

剩下的就是在需要时将预加载的 Web View 添加到容器中:

func loadWebview() {
    // retrieve the preloaded web view, add it to the container
    let webview = webviewPreloader.webview(for: Bundle.main.indexURL)
    webview.frame = webviewContainer.bounds
    webview.translatesAutoresizingMaskIntoConstraints = true
    webview.autoresizingMask = [.flexibleWidth, .flexibleHeight]
    webviewContainer.addSubview(webview)
}

最后一点，请注意，让 Web View 实例保持事件状态可能会带来性能损失 - 内存和 CPU 方面。