当没有匹配项时，正则表达式性能不佳

我遇到正则表达式运行缓慢的问题，但仅限于模式不匹配的情况。在所有其他情况下即使文本末尾的模式匹配，性能也是可以接受的。我正在测试 100KB 文本输入的性能。

我想做的是将输入转换为类似 HTML 的语法，使用 [] 而不是 括号，并将其转换为有效的 XML。

输入示例：

...some content[vc_row param="test1"][vc_column]text [brackets in text] content[/vc_column][/vc_row][vc_row param="xxx"]text content[/vc_row]...some more content

示例输出：

...some content<div class="vc_row" param="test1"><div class="vc_column" >text [brackets in text] content</div></div><div class="vc_row" param="xxx">text content</div>...some more content

为此，我使用正则表达式：

/(.*)(\[\/?vc_column|\[\/?vc_row)( ?)(.*?)(\])(.*)/

我在 while 循环中执行此操作，直到模式匹配为止。

正如我之前提到的，这是有效的，但最后一次迭代非常慢（或者如果没有匹配则很快）。这是我正在使用的完整 JavaScript：

var str   = '...some content[vc_row param="test1"][vc_column]text content[/vc_column][/vc_row][vc_row param="xxx"]text content[/vc_row]...some more content';

var regex = /(.*)(\[\/?vc_column|\[\/?vc_row)( ?)(.*?)(\])(.*)/;
while (matches = str.match(regex)) {
    matches = str.match(regex);
    if (matches[2].slice(1, 2) !== '/')
        str = matches[1] + "<div class=\"" + matches[2].slice(1) + "\"" + " " + matches[4] + ">" + matches[6];
    else
        str = matches[1] + "</div>" + matches[6];
}

我怎样才能提高我的正则表达式“不匹配”性能？

您可以将其分成 2 个正则表达式。 一种用于开始标签，一种用于结束标签。

然后链2全局g取代。

var str   = '...some content[vc_row param="test1"][vc_column]text with [brackets in text] content[/vc_column][/vc_row][vc_row param="xxx"]text content[/vc_row]...some more content';

const reg1 = /\[(vc_(?:column|row))(\s+[^\]]+)?\s*\]/g;
const reg2 = /\[\/(vc_(?:column|row))\s*\]/g;

var result = str.replace(reg1, "<div class=\"$1\"$2>").replace(reg2, "</div>");

console.log(result);

请注意，那些(.*)在原始正则表达式中不需要这种方式。

使用无名函数，则可以通过 1 个正则表达式替换来完成。

var str   = '...some content[vc_row param="test1"][vc_column]text with [brackets in text] content[/vc_column][/vc_row][vc_row param="xxx"]text content[/vc_row]...some more content';

const reg = /\[(\/)?(vc_(?:column|row))(\s+[^\]]+)?\s*\]/g;

var result = str.replace(reg, function(m,c1,c2,c3){
              if(c1) return "</div>";
              else return "<div class=\""+ c2 +"\""+ (c3?c3:"") +">";
             });

console.log(result);