Home > Web Front-end > JS Tutorial > Performance optimization for JavaScript: loading and execution

Performance optimization for JavaScript: loading and execution

黄舟
Release: 2017-02-07 14:48:25
Original
924 people have browsed it

With the continuous promotion of Web2.0 technology, more and more applications use JavaScript technology for processing on the client side, making the performance of JavaScript in the browser the most important usability issue faced by developers. This problem is complicated by the blocking nature of JavaScript, which means that when the browser is executing JavaScript code, it cannot do anything else at the same time.

This article details how to correctly load and execute JavaScript code to improve its performance in the browser.

01-

Overview

No matter whether the current JavaScript code is embedded or in an external link file, the downloading and rendering of the page must stop and wait for the script execution to complete. The longer the JavaScript execution process takes, the longer the browser waits to respond to user input. The reason why browsers block when downloading and executing scripts is that the script may change the namespace of the page or JavaScript, which affects the content of subsequent pages. A typical example is using document.write() on the page. For example, Listing 1

Listing 1 JavaScript code inline example

<html>
<head>
    <title>Source Example</title>
</head>
<body>
    <p>
    <script type="text/javascript">
        document.write("Today is " + (new Date()).toDateString());
    </script>
    </p>
</body>
</html>
Copy after login

When the browser encounters the

Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template