yaniswang / xhEditor

xhEditor是一个基于jQuery开发的简单迷你并且高效的在线可视化HTML编辑器。
http://xheditor.com/
GNU Lesser General Public License v3.0
244 stars 79 forks source link

匹配空行正则的问题 #21

Open creamidea opened 9 years ago

creamidea commented 9 years ago

今天在使用xhEditor的时,发现在提交的时候非常的缓慢。通过CPU性能排查,发现了主要是这一行的问题:

a = a.replace(/^\s*(?:<(p|div)(?:\s+[^>]*?)?>)?\s*(<span(?:\s+[^>]*?)?>\s*<\/span>|<br(?:\s+[^>]*?)?>|&nbsp;)*\s*(?:<\/\1>)?\s*$/i, "");

然后我的输入时是这个:

var a = "                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                 故障原因:测绘一下啊<br>故障进展:"

用node测试结果如下: image

完整的是这个

var a = "                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                 故障原因:测绘一下啊<br>故障进展:"
a = a.replace(/^\s*(?:<(p|div)(?:\s+[^>]*?)?>)?\s*(<span(?:\s+[^>]*?)?>\s*<\/span>|<br(?:\s+[^>]*?)?>|&nbsp;)*\s*(?:<\/\1>)?\s*$/i, "");

这个需要优化一下吗?还是需要我尽量避免这样的输入?谢啦>_< (PS:不是很理解为何这句正则会运行这么慢,不知道作者能否帮我解惑一下?)

creamidea commented 9 years ago

后来我在我同学的提醒下,把正则先“编译”了一下,速度立刻提上去了。

var r = new RegExp('^\s*(?:<(p|div)(?:\s+[^>]*?)?>)?\s*(<span(?:\s+[^>]*?)?>\s*<\/span>|<br(?:\s+[^>]*?)?>|&nbsp;)*\s*(?:<\/\1>)?\s*$', 'i')
a = a.replace(r, "")

希望能够把源代码中所有用到正则的地方能够编译一下。 :)

creamidea commented 8 years ago

在这行代码 https://github.com/yaniswang/xhEditor/blob/master/src/main.js#L797 前能不能先 trim() 一下?把前尾的空白字符去掉。然后把正则改简单一点? /^(?:<(p|div)(?:\s+[^>]*?)?>)?\s*(<span(?:\s+[^>]*?)?>\s*<\/span>|<br(?:\s+[^>]*?)?>|&nbsp;)*\s*(?:<\/\1>)?\s*$/

这个样子可以避免我上面说到的问题。望参考 :)