模态对话框使用动态生成的按钮缓慢显示

Question

我在“模态对话框”中遇到性能问题。当我单击一个按钮时，对话框需要一段时间才能显示。我的页面上有卡片，每个卡片包含一个打开对话框的按钮。我的页面上最多有200张卡片（200个按钮）。这是我用来向每个按钮动态添加事件侦听器的代码：

var dialogButton = document.querySelectorAll('.dialog-button');
var dialog = document.querySelector('#dialog');

for (var i = 0; i != dialogButton.length; i++) {
    dialogButton[i].addEventListener('click', function () {
        dialog.showModal();
    });

为什么要花这么长时间才能出现？ （〜1-2s）