Mathjax 与 Valine 评论 阻塞问题 （与主题无关）

[ghost]

您好，我又来问问题啦 😄

我注意到当页面有许多 Mathjax 公式时，在Valine 的 textarea 打字会极其卡顿，这个现象我之前用 NexT 主题也会发生，所以此问题与主题无关。

可问题来了，用户在有大量 Mathjax 公式的页面尝试评论都会被劝退，这会造成很不好的体验。

不知道有没有人知道怎么解决这个问题呢？

我的网站可在线测试页面：比耐公式

初步怀疑是 JS 阻塞了

• 因为此时此刻页面左下角的模型也停止运动了

• 整个页面同时卡顿

• 但页面可以正常滚动，只不过滚动条不会跟着移动

我不认为是我环境的问题，也有兄弟遇到同样的 issue

不知此问题能否解决呢？我并不太懂前端 ㄒoㄒ

[touko628]

调了一下，发现应该是打字特效的问题，把特效去掉试试？

[touko628]

调了一下，发现应该是打字特效的问题，把特效去掉试试？

淦，另一个主题加特效以后变卡了，这个主题去掉特效并没有变好（巨大谔谔

[xaoxuu]

https://github.com/xCss/Valine

[ghost]

xCss/Valine#305
Valine 的锅，我把问题关了

[xaoxuu]

不加载Valine评论时的公式的HTML结构：

开启Valine评论时的公式的HTML结构：（Valine设置了 mathJax: false）

由图可见开启了Valine评论之后公式就会无限嵌套。

公式加载部分的代码和NexT主题一模一样，NexT页面的公式也不存在无限嵌套的问题。

[inkss]

其实，或许，可以尝试换成 katex 渲染，他们的区别就好比一个是后端渲染，一个是前端渲染。

虽然后来因为我不会用这个写公式，就再也没研究过了。

[inkss]

但是 katex 支持的公式写法好像没 mathjax 那么多，啊哈哈哈，感觉不如用截图显示公式

[ghost]

我更喜欢 MathJax 哈哈

[inkss]

but ，MathJax 渲染真的好慢呀

[MHuiG]

but ，MathJax 渲染真的好慢呀

可不可以在hexo生成页面的时候直接生成已经完成渲染MathJax 的页面

[ghost]

这个卡顿主要是 Valine 的问题，Mathjax 和 Katex 我不知道区别，不过我 Mathjax 用习惯了哈哈

[MHuiG]

https://github.com/next-theme/hexo-filter-mathjax

[MHuiG]

没用过，不知道配置项会不会冲突

[ghost]

我用 hexo-renderer-pandoc + 主题提供的 MathJax（https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js）完美匹配所有 MathJax 语法

[ghost]

两个$$符号夹着，中间直接写公式，不用转义符啥的，超爽

[ghost]

直接渲染出来了

[MHuiG]

hexo-renderer-pandoc

get it！

[ghost]

唉，过多几个月正式学一下前端，把这个主题优化一下，现在问题还太多了

• pjax不兼容 （音乐播放器，valine，toc，各种 js 代码重载，这我不太懂
• 导航栏 sub 和 main 结合在一起没什么意义，干脆直接固定main在顶部就好了 （至少我觉得 😄 ，不过这个导航栏写的很好，舍弃了又有点可惜
• 没有夜间模式（主题配置可修改颜色，但要是能写个js部件实时切换可行
• 加个 pwa 教程（可
• 要是站点配置文件能写在外部的data文件就好了，全部覆盖的那种，这样更新主题就方便了，用户只写他们想改的配置，其他保持默认。
• 加入引入外部 styl 文件支持，可写入css样式，原生的css很难写吧，渲染的时候把data里的styl文件放进渲染程序

[inkss]

这个卡顿主要是 Valine 的问题，Mathjax 和 Katex 我不知道区别，不过我 Mathjax 用习惯了哈哈

可不可以在hexo生成页面的时候直接生成已经完成渲染MathJax 的页面

@MHuiG Katex 的渲染就是直接渲染到 html 页面了，所以我才说，他就好比后端渲染，mathjax 类似于前端渲染，总归是需要点时间的。