English
Menu

Web Technology Basics

In the processing a browser does before showing the first screen (the critical rendering path), a <script src="app.js"> written without attributes inside <head> makes the HTML parser stop at that point. Which of the following correctly describes the behavior when the defer attribute is added to this element?

  1. AIt is executed immediately as soon as the download finishes, stopping the HTML parser, and the execution order of multiple scripts is not guaranteed
  2. BIt is neither downloaded nor executed, and is loaded only when the user first interacts with the page
  3. CIt is downloaded while the HTML parser keeps working and executed after the document has been parsed, in the order written in the document
Show answer and explanation

Answer: C. It is downloaded while the HTML parser keeps working and executed after the document has been parsed, in the order written in the document

The browser parses HTML to build the DOM and CSS to build the CSSOM, combines the two to decide what to draw, calculates the positions and sizes of elements (layout) and then draws them (paint). A script element without attributes may rewrite the DOM, so the HTML parser stops until the script has been downloaded and executed. With defer, the download proceeds while the parser keeps working, and execution happens after the whole document has been parsed, in the order written in the document. With async, a script runs as soon as its download finishes, so the order is not guaranteed.

  • A. This is the behavior of the async attribute. With defer, scripts run after the document has been parsed, in the order written.
  • B. Even with defer, the script is downloaded right away and executed without waiting for user interaction.
  • C. Correct. It is downloaded without stopping the parser and executed after the document has been parsed, in the order written.
Practice this topic Back to topic

Books on Web Technology Basics Ad

As an Amazon Associate I earn from qualifying purchases.

More Web Technology Basics questions

  1. When the JavaScript above is run in a browser, which of the following is the order in which the characters are shown on the console?
  2. Under the browser's same-origin policy, which of the following URLs is considered to have the same origin as https://www.example.com/app/index.html?
  3. JavaScript on a page at https://app.example.com uses fetch to send a POST request with a body of Content-Type application/json to https://api.example.net/orders. Which of the following correctly describes how CORS behaves in this case?
  4. Which of the following correctly describes a Service Worker?
  5. For a page with responsive design that also supports smartphones, which of the following is the main purpose of writing <meta name="viewport" content="width=device-width, initial-scale=1"> in <head>?