Hide WKWebView until page is loaded and JavaScript has run

My goal is to hide my application's embedded WKWebView until certain page elements (e.g. header and footer) are removed from the DOM.

My current process looks like this (see code snippets below):

1. Set WKWebView to hidden (after instantiation and in the didStartProvisionalNavigation hook).
2. Run JavaScript to remove page elements in the didFinish navigation hook, setting the WKWebView to visible in the completion handler.

override func webView(_ webView: WKWebView, didStartProvisionalNavigation navigation: WKNavigation!) {
    webView.isHidden = true
}

override func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) {
    var scriptContent = ""
    do {
        scriptContent = try String(contentsOfFile: GlobalVariables.mainScriptURL!, encoding: String.Encoding.utf8)
    } catch {
        print("Error loading JavaScript file.")
    }
    webView.evaluateJavaScript(scriptContent, completionHandler: { result, error in
        webView.isHidden = false
    })
}

GlobalVariables.mainScriptURL contents:

$('header').hide();
$('footer').hide();

When the above code executes, I still occasionally see the header prior to its removal. Is there a delay between my JavaScript updating the DOM and the WKWebView redrawing its content that I'm failing to consider? How can I ensure that the content is never visible to my users prior to that JavaScript running and completely removing those elements from the DOM?