Back

DOM size

What is the DOM ?

The DOM (Document Object Model) is the result of the interpretation of the HTML code of a web page by the browser. It is a representation of data in the form of a tree composed of nodes and elements where each element belonging to a node is a child. It also provides a useful programming interface (API) for modifying the page using JavaScript code.

Document
    - <html>
        - <head>
            - <title>
                - DOM size
        - <body>
            - <h1>
                - What is the DOM ?
            ...

Why is the DOM size important ?

The larger the DOM size is, the longer the browser will take to create and interpret it, which will slow down the page rendering and place greater demands on the resources of the user's computer.

How can I manage the DOM size ?

The DOM must have :

  • less than 1,500 elements in total
  • a maximum depth of 32 elements
  • less than 60 child elements in a parent element