排雷
本文纯属个人观点,主观性极强,存在片面性和局限性,请谨慎参考
契机
刚弄完prism.js,还在无尽地优化中呢,转头就变心了,我受不了无止境地填写metabox里的lang-xxx了!
就不能自动检测吗?我是真的很懒诶……
转机
找啊找啊,也没找到我看得懂的方法,倒是看到了有相同困扰的人们在GitHub上的吐槽,原来懒鬼不止我一个!
不过看大家说highlight.js就有自带的语言检测功能诶!
纠结
虽然我都懒得再尝试一个新工具了,还有狗屁的沉没成本在阻止着我尝试,还有恶魔的低语一直在我耳边念叨着:
“prism.js能用不就好了吗,好不容易弄出来的不是吗?”
“不就是手打几千遍lang-xxx嘛,将就一下不就好了嘛?”
但还是忍不了,忍不了一点!
“要打你打!反正老子不打了!”
于是又开始新一轮的尝试……然后……
变心
虽然我是为了内置的自动检测语言功能来的,可是它有github-dark主题诶!
看了眼,仿佛就是我的VSCode再现!这谁忍得了啊!反正我忍不了了!
prism.js的主题试看,每次选择后都得滚到最底下才看得到效果,我找了好久才找到,用户体验烂爆了!
而highlight.js专门做个了页面提供主题试看诶!超级直观!用户体验棒呆了好嘛!
心动
highlight.js做得到,但prism.js做不到的:
- 自动检测语言
未来的文章再也不用一遍遍地手动加额外的CSS类了!
过去的文章不用管,什么都不用做,也会自动高亮! - 支持github-dark等几百个主题
- 提供方便的主题试看
- 官方网站设计得更现代、导航更清晰、用户体验更好
- 下载页面提供实时搜索,虽然prism也能用Ctrl+F查找,但用户体验的确有差距
更贴心的是搜索栏下有很清晰直观的 Selected Languages: xml×css×php×
让我不禁想起了之前用prism.js时troubleshoot了半天,
最后发现php不显示的原因是下载时以为自己勾选了其实没勾选的噩梦般的回忆……
吃过苦头,才能更加体会到这些细节设计得这么贴心是件多么伟大的事啊!
虽然用不上时不以为意、习以为常,在其实在不知不觉中替你省下了超多可能会被浪费的时间啊!
冷静
当然也存在弊端:
- prism.js下载时可选各种好用的插件,比如Copy按钮,highlight.js得自己想办法
- prism.js就两个文件,highlight.js解压后的文件很多很吓人,技术白痴的我真的看不懂
- prism.js自动覆盖了我用的主题的默认代码区块样式,highlight.js需要我手动做点啥