博客评论区升级——根据【热度】给楼层排序,以及几个易用性改善

2016-10-10 原文 #编程随想 的其它文章

博客评论区升级——根据【热度】给楼层排序,以及几个易用性改善

放长假之前,俺提到说——利用这个长假把评论区的界面重写。本来预计在 10月7日 完工,结果还是延迟了几天 :( 所幸终于赶在“中华民国的国庆日”完工了。
下面就来介绍一下这次升级带来的新功能。

★为啥要把评论区的界面进行【代码重写】?


首先声明,俺当然不是闲得蛋疼才干这事儿。至少2年前,俺就想把这个界面的代码重写了。因为每次提供新功能,都需要在 Blogger/blogspot 的评论系统中进行修修补补,而且里面有好多坑子,又缺乏代码级的文档,很容易引入 bug
之所以拖到现在,是因为当年对这坨代码了解不够深入,不敢贸然行动。
上个月,俺搞定了“ 无刷新自动载入新评论 ”,也借机把 Blogger/blogspot 的评论系统的内部机制搞清楚了。
重写了代码之后,俺再想要加某个新功能,就方便多了(不用在原有代码中 hacks)。

★此次的最大改进——根据热度对楼层排序


常来逛评论区的同学,应该都知道最近2年,每篇博文的评论数,动不动就 300+ 或 400+。这么多评论,俺重头到尾看一遍,个把小时就没了(这还只是光看不回复)。如果俺把所有评论全回复一遍,这一天就干不成其它事儿了 :(
所以,【对楼层的智能排序】非常有必要。有了这个功能,俺就可以优先处理关注度高的楼层。

另外一个好处是:俺可以利用算法来促使【匿名用户使用网名】。
如今大部分匿名用户都不喜欢填写网名,导致的坏处就是——一群人在那讨论,每个人都是“匿名”,都搞不清谁是谁。如果大伙儿自觉设置网名,好歹看出哪些评论是同一人发的。
当然,肯定有人担心——网名存在“冒名顶替”或“重名”的弊端。比如说:(某些逛评论区的老读者应该还记得)当年有两个“忠党爱国”互掐的事情。
这2个问题目前是【无解】的——要想匿名留言,就【无法】避免“冒名顶替”或“重名”。

言归正传,如今俺的排序算法,会对每一个留言进行评分。评分的高低取决于两个维度:
1、“留言作者”的权重(登录用户 > 有网名的匿名用户 > 无网名的匿名用户)
2、“留言数”的权重(目前只统计该用户在【同一篇博文】的留言数)

然后排序代码会把每一个楼层所有“评论/留言”的分数加起来,得到一个总分。这个总分就是界面上显示的“热度”。

注:俺的算法中,会把留言数进行“对数”运算。至于为啥用“对数”,有兴趣的同学可以参考某些全球顶级的 web 2.0 网站(比如:reddit、HN ...)的热榜排名算法。

根据这个算法,可以得出几个结论:
1、某个楼层的嵌套回复越多,总分越多
2、总分越多,排名越靠前,那么吸引的注意力会越多(此时 1 与 2 构成一个正反馈)
3、【只要你不是“无名的匿名用户”】你发的评论越多,你的每一条评论的分数就越大(这个分数没有封顶)
4、【如果你是“无名的匿名用户”】因为俺无法区分这类评论是否同一人发出。即使你发的评论再多,每一条评论也只有1分。
5、俺通常是回帖数最多的人,所以俺参与其中的楼层,总分会快速增长,于是排名靠前(这样可以提升俺处理评论的效率)

★其它一些易用性改进


◇更平滑地加载200条之后的评论


原先的 Blogger 评论系统,对于“200条之后的评论”,它采用“每次加载50条”,直到全部载入。
假设200条之后的评论有 101 条,那么它分三次载入(50、50、1);
如今俺的“平滑载入策略”是——每次不超过50并且确保各次的载入数平均化。比如,对上述情况会是(34、34、33);
“平滑载入策略”对于网络不稳定的情况,优点很明显——会让载入失败的概率最小化。

◇更多的“回复按钮”


原先的 Blogger 评论系统,只有在“每层楼楼主”以及“每层楼末尾”,有“回复按钮”。如果这一层楼的嵌套评论很多,超过一屏,你要点回复按钮就不太方便了。
如今俺在每一个嵌套评论(次级评论)上有放了“回复按钮”。

◇关于“当前评论”跳转


当你点击某个评论的“回复按钮”,俺会把这个评论设置为“当前评论”(视觉效果是“蓝色边框”)。(在同一个瞬间)只会有一个“当前评论”。它对应着网址中的 hash 部分(也就是网址井号后面的部分)。
这么干的好处是:
1、原先回评论时,弹出了新窗口。不容易直观看出新窗口对应的是哪个评论。现在加了“当前评论的效果”,就比较直观了。
2、如果你回复了好几个评论,然后又想去看之前回复的某个评论,你可以直接用浏览器的“后退按钮/backward”。
3、你可以用浏览器的“前进”和“后退”按钮,在多个评论中跳转(这些评论都曾经是“当前评论”)。

◇增加几种 BBCode 语法


新增加了“居中语法”,写法如下:
[center]你想要居中的文字[/center]

新增加了“引用语法”,写法如下:(被引用的部分,会有不同的底色和缩进。)
[quote]你想要引用的文字[/quote]

◇“增加新楼层”的按钮


本文发布后,很多读者反馈说:找不到原先在页面底部的“添加评论”按钮。另外也有读者反馈说:每次盖新楼层,都要翻到页面底部,很麻烦。
于是俺想了一招:在每个楼层都放上“增加新楼层”的按钮。


俺博客上,和本文相关的帖子(需翻墙)
博客评论功能重要升级——留言或围观都【无需】重刷页面
博客评论功能升级(智能贴图、图片代理)——兼谈“Web 图片的隐私问题及防范”
博客评论功能升级(“未读”状态、按时间过滤)——兼谈“为啥俺不用其它博客平台”
博客评论功能升级(增加“留言过滤”、“200条之后自动加载”等)
博客评论功能升级(引入 BBCode 语法),顺便分享一下实现方法
版权声明
本博客所有的原创文章,作者皆保留版权。转载必须包含本声明,保持本文完整,并以超链接形式注明作者 编程随想 和本文原始地址:
https://program-think.blogspot.com/2016/10/custom-blogger-comment.html

文章版权归原作者所有。
二维码分享本站