From the link you posted:

    The HTML <dialog> element is used to create both modal and non-modal dialog boxes. Modal dialog boxes interrupt interaction with the rest of the page being inert, while non-modal dialog boxes allow interaction with the rest of the page.

The modal dialogs are easier for the programmer to use but they're quite inconvenient because generally, they ask you a question you can answer only by looking at/interacting with the rest of the page. Which you can't do (the modal dialogs on web also almost never can be dragged around).

The term "modal" pre-dates <dialog> by a huge amount, and generally refers to a popup within the same window that prevents interacting with what's behind the popup (I believe the term comes from how you "change modes" when it appears). On the web they used to be implemented using <div> and CSS, often with some sort of javascript library so you didn't have to do it yourself.