@wcj/github-rank 22.9.20 → 22.9.21

package/web/data/sifou-daily.json

@@ -1,56 +1,92 @@
 [
   {
-    "title": "新指令 v-memo，提高性能的又一利器",
-    "description": "本文首发于微信公众号：大迁世界, 我的微信：qq449245884，我会第一时间和你分享前端行业趋势，学习途径等等。更多开源作品请看 GitHub [链接] ，包含一线大厂面试完整考点、资料以及我的系列文章。",
-    "url": "https://segmentfault.com/a/1190000042442388",
-    "author": "前端小智",
-    "home_url": "https://segmentfault.com/u/minnanitkong",
-    "votes": "1",
+    "title": "单标签实现复杂的棋盘布局",
+    "description": "其实，对于一个页面的布局而言，标签越少不一定是好事，我们在考虑 DOM 的消耗的同时，也需要关注代码的可读性，以及后续基于这个布局的制作的交互的难易性等等。",
+    "url": "https://segmentfault.com/a/1190000042513947",
+    "author": "chokcoco",
+    "home_url": "https://segmentfault.com/u/chokcoco",
+    "votes": "6",
     "rank": 1
   },
   {
-    "title": "50天用vue3完成了50个web项目，我学到了什么?",
-    "description": "通过本文的50个web示例你将学到:Vue3核心基础语法和进阶语法less核心基础语法和进阶语法scss核心基础语法和进阶语法1.Expanding Cards效果如图所示:源码在线示例学到了什么?JavascriptVue ref方法定义基本响应式...",
-    "url": "https://segmentfault.com/a/1190000042509082",
-    "author": "夕水",
-    "home_url": "https://segmentfault.com/u/xishui_5ac9a340a5484",
-    "votes": "5",
+    "title": "借助 :has 实现3d轮播图",
+    "description": "前不久在这篇文章：CSS 有了:has伪类可以做些什么 中介绍了:has伪类的一些使用场景，可以说大大颠覆了 CSS 选择器的认知，让很多繁琐的 js逻辑通过灵活的CSS轻易实现了。这次带来一个比较常见的案例，3d 轮播图，...",
+    "url": "https://segmentfault.com/a/1190000042512102",
+    "author": "XboxYan",
+    "home_url": "https://segmentfault.com/u/xboxyan",
+    "votes": "1",
     "rank": 2
   },
   {
-    "title": "精读《State of CSS 2022》",
-    "description": "解决业务代码的 !important 问题。为什么业务代码需要用 !important 解决问题？因为 css 优先级由文件申明顺序有关，而现在大量业务使用动态插入 css 的方案，插入的时机与 js 文件加载与执行时间有关，这就导致...",
-    "url": "https://segmentfault.com/a/1190000042507985",
-    "author": "黄子毅",
-    "home_url": "https://segmentfault.com/u/aoyangyudakong",
+    "title": "面试官：请使用JS实现一个优先队列",
+    "description": "在上个月的四次面试中关于优先队列这种数据结构被问到了两回；还好之前看过部分React源码的scheduler部分对小顶堆有一些理解，模棱两可的说出一部分，现在简单讲讲堆这种数据结构，以及用JS如何实现；",
+    "url": "https://segmentfault.com/a/1190000042515702",
+    "author": "龙骑士尹道长",
+    "home_url": "https://segmentfault.com/u/crow_5c1708a9c847d",
     "votes": "2",
     "rank": 3
   },
   {
-    "title": "深入浅出 JavaScript 中的 this",
-    "description": "笔者最近在看 你不知道的JavaScript上卷，里面关于 this 的讲解个人觉得非常精彩。JavaScript 中的 this 算是一个核心的概念，有一些同学会对其有点模糊和小恐惧，究其原因，现在对 this 讨论的文章很多，让我们...",
-    "url": "https://segmentfault.com/a/1190000042509466",
-    "author": "Gopal",
-    "home_url": "https://segmentfault.com/u/fengguangping",
+    "title": "WGCLOUD进阶笔记 - 监测oracle表空间",
+    "description": "我们最近在项目中部署了WGCLOUD平台，它可以监测主机、服务器、进程应用、端口、日志、docker、数据库、服务接口、PING、SNMP等等",
+    "url": "https://segmentfault.com/a/1190000042514367",
+    "author": "一往情深",
+    "home_url": "https://segmentfault.com/u/9b3sps2b",
     "votes": "1",
     "rank": 4
   },
   {
-    "title": "用Colab免费部署自己的AI绘画云平台—— Stable Diffusion",
-    "description": "AI绘画门槛又又又降低了，从最开始需要花半天时间折腾的 Disco-Diffusion ，紧接着 Stable Diffusion 在 github 上开源，各家平台都推出了云平台，让用户通过轻松的点击、选择、输入就能生成一张张AI图。",
-    "url": "https://segmentfault.com/a/1190000042509388",
-    "author": "程序员秋风",
-    "home_url": "https://segmentfault.com/u/qiufeng_5a07f6cb96ee0",
+    "title": "停止像这样使用 \"async/await\"，改用原版",
+    "description": "本文首发于微信公众号：大迁世界, 我的微信：qq449245884，我会第一时间和你分享前端行业趋势，学习途径等等。更多开源作品请看 GitHub [链接] ，包含一线大厂面试完整考点、资料以及我的系列文章。",
+    "url": "https://segmentfault.com/a/1190000042512976",
+    "author": "前端小智",
+    "home_url": "https://segmentfault.com/u/minnanitkong",
     "votes": "1",
     "rank": 5
   },
   {
-    "title": "微服务开发系列：为什么选择 kotlin",
-    "description": "开发人员可以根据自己需要采用 java 语言开发，但是很明显的，项目中各种工具类已经为了 kotlin 做出了很多修改，如果大量采用 java 开发， 结果可能是比纯 java 开发的速度还要慢。",
-    "url": "https://segmentfault.com/a/1190000042509913",
-    "author": "zxdposter",
-    "home_url": "https://segmentfault.com/u/zxdposter",
-    "votes": "2",
+    "title": "手写一个mini版本的React状态管理工具",
+    "description": "手写一个mini版本的React状态管理工具目前在React中，有很多各式各样的状态管理工具，如：React ReduxMobxHox每一个状态管理工具都有着不尽相同的API和使用方式，而且都有一定的学习成本，而且这些状态管理工具也...",
+    "url": "https://segmentfault.com/a/1190000042517443",
+    "author": "夕水",
+    "home_url": "https://segmentfault.com/u/xishui_5ac9a340a5484",
+    "votes": "1",
     "rank": 6
+  },
+  {
+    "title": "作为前端工程师，你还不懂怎么用Node写静态文件服务器吗？",
+    "description": "作为前端工程师，我想大家一定对静态文件服务器不会陌生。所谓的静态文件服务器做的工作就是将我们的前端静态文件(.js/.css/.html)传输给浏览器，然后浏览器再将我们的页面渲染出来。我们常用的webpack-dev-serve...",
+    "url": "https://segmentfault.com/a/1190000042514709",
+    "author": "进击的大葱",
+    "home_url": "https://segmentfault.com/u/jinjidedacong",
+    "votes": "1",
+    "rank": 7
+  },
+  {
+    "title": "这几种常见的 JVM 调优场景，你知道吗？",
+    "description": "cpu占用过高要分情况讨论，是不是业务上在搞活动，突然有大批的流量进来，而且活动结束后cpu占用率就下降了，如果是这种情况其实可以不用太关心，因为请求越多，需要处理的线程数越多，这是正常的现象。",
+    "url": "https://segmentfault.com/a/1190000042514163",
+    "author": "Java架构师",
+    "home_url": "https://segmentfault.com/u/taozi_60b0b3c71b1a8",
+    "votes": "1",
+    "rank": 8
+  },
+  {
+    "title": "SegmentFault 思否技术周刊 — 你还想学 Go 语言吗 ？",
+    "description": "运算符重载其实并不是一个常用的功能；因为会改变运算符的语义，比如明明是加法却在重载函数中写为减法。这会使得代码阅读起来困难，但在某些情况下我们又非常希望语言本身能支持运算符重载。比如在 Go 中常用的...",
+    "url": "https://segmentfault.com/a/1190000042513773",
+    "author": "Beverly",
+    "home_url": "https://segmentfault.com/u/beverly0",
+    "votes": "2",
+    "rank": 9
+  },
+  {
+    "title": "爬虫与反爬虫技术简介",
+    "description": "互联网的大数据时代的来临，网络爬虫也成了互联网中一个重要行业，它是一种自动获取网页数据信息的爬虫程序，是网站搜索引擎的重要组成部分。通过爬虫，可以获取自己想要的相关数据信息，让爬虫协助自己的工作，...",
+    "url": "https://segmentfault.com/a/1190000042513322",
+    "author": "vivo互联网技术",
+    "home_url": "https://segmentfault.com/u/vivo_tech",
+    "votes": "2",
+    "rank": 10
   }
 ]

package/web/data/sifou-monthly.json

@@ -5,9 +5,18 @@
     "url": "https://segmentfault.com/a/1190000042447341",
     "author": "dreamapplehappy",
     "home_url": "https://segmentfault.com/u/dreamapplehappy",
-    "votes": "19",
+    "votes": "20",
     "rank": 1
   },
+  {
+    "title": "还在用定时器吗？借助 CSS 来监听事件",
+    "description": "平时工作中很多场合都要用到定时器，比如延迟加载、定时查询等等，但定时器的控制有时候会有些许麻烦，比如鼠标移入停止、移出再重新开始。这次介绍几个借助 CSS 来更好的控制定时器的方法，一起了解一下吧，相信...",
+    "url": "https://segmentfault.com/a/1190000042475578",
+    "author": "XboxYan",
+    "home_url": "https://segmentfault.com/u/xboxyan",
+    "votes": "18",
+    "rank": 2
+  },
   {
     "title": "自定义计数器小技巧！CSS 实现长按点赞累加动画",
     "description": "欢迎关注我的公众号：前端侦探在某条 APP 中，如果长按点赞，会出现这样花里胡哨的动画，如下这个动画有两部分组成，其中这个随机表情的实现可以参考 coco 的这篇文章 巧用 transition 实现短视频 APP 点赞动画比...",
@@ -15,7 +24,16 @@
     "author": "XboxYan",
     "home_url": "https://segmentfault.com/u/xboxyan",
     "votes": "19",
-    "rank": 2
+    "rank": 3
+  },
+  {
+    "title": "「多图预警」完美实现一个@功能",
+    "description": "一天产品大大向 boss 汇报完研发成果和产品业绩产出，若有所思的走出来，劲直向我走过来，嘴角微微上扬。产品大大：boss 对我们的研发成果挺满意的，balabala...（内心 OS：不听，讲重点）产品大大：咱们的客服 I...",
+    "url": "https://segmentfault.com/a/1190000042481321",
+    "author": "wuwhs",
+    "home_url": "https://segmentfault.com/u/wuwhs",
+    "votes": "17",
+    "rank": 4
   },
   {
     "title": "组员老是忘记打卡，我开发了一款小工具，让全组三个月全勤！",
@@ -24,16 +42,7 @@
     "author": "杨成功",
     "home_url": "https://segmentfault.com/u/ruidoc",
     "votes": "13",
-    "rank": 3
-  },
-  {
-    "title": "还在用定时器吗？借助 CSS 来监听事件",
-    "description": "平时工作中很多场合都要用到定时器，比如延迟加载、定时查询等等，但定时器的控制有时候会有些许麻烦，比如鼠标移入停止、移出再重新开始。这次介绍几个借助 CSS 来更好的控制定时器的方法，一起了解一下吧，相信...",
-    "url": "https://segmentfault.com/a/1190000042475578",
-    "author": "XboxYan",
-    "home_url": "https://segmentfault.com/u/xboxyan",
-    "votes": "16",
-    "rank": 4
+    "rank": 5
   },
   {
     "title": "妙啊！纯 CSS 实现拼图游戏",
@@ -42,15 +51,6 @@
     "author": "chokcoco",
     "home_url": "https://segmentfault.com/u/chokcoco",
     "votes": "19",
-    "rank": 5
-  },
-  {
-    "title": "「多图预警」完美实现一个@功能",
-    "description": "一天产品大大向 boss 汇报完研发成果和产品业绩产出，若有所思的走出来，劲直向我走过来，嘴角微微上扬。产品大大：boss 对我们的研发成果挺满意的，balabala...（内心 OS：不听，讲重点）产品大大：咱们的客服 I...",
-    "url": "https://segmentfault.com/a/1190000042481321",
-    "author": "wuwhs",
-    "home_url": "https://segmentfault.com/u/wuwhs",
-    "votes": "14",
     "rank": 6
   },
   {
@@ -71,6 +71,15 @@
     "votes": "15",
     "rank": 8
   },
+  {
+    "title": "实现《羊了个羊》的小游戏",
+    "description": "这两天火爆全场的《羊了个羊》游戏，相信大家都玩过了，那么在玩这个游戏的同时，我想大家都会好奇这个游戏的实现，本文就带大家使用css,html,js来实现一个动物版的游戏。",
+    "url": "https://segmentfault.com/a/1190000042502121",
+    "author": "夕水",
+    "home_url": "https://segmentfault.com/u/xishui_5ac9a340a5484",
+    "votes": "12",
+    "rank": 9
+  },
   {
     "title": "如何让CSS计数器支持小数的动态变化？",
     "description": "最近在几篇文章中都用到了 CSS 计数器，可以将 CSS 变量通过伪元素content动态展示出来，还可以做出很多有趣的动画。有兴趣的可以先回顾一下之前的这几篇文章：",
@@ -78,7 +87,7 @@
     "author": "XboxYan",
     "home_url": "https://segmentfault.com/u/xboxyan",
     "votes": "11",
-    "rank": 9
+    "rank": 10
   },
   {
     "title": "中秋佳节之际, 一起来欣赏 9 个冷门的css属性",
@@ -87,7 +96,7 @@
     "author": "lulu_up",
     "home_url": "https://segmentfault.com/u/lulu_up",
     "votes": "10",
-    "rank": 10
+    "rank": 11
   },
   {
     "title": "CSS transform、transition、animation 指南",
@@ -96,16 +105,16 @@
     "author": "散一群逗逼",
     "home_url": "https://segmentfault.com/u/sanyiqundoubi",
     "votes": "11",
-    "rank": 11
+    "rank": 12
   },
   {
-    "title": "实现《羊了个羊》的小游戏",
-    "description": "这两天火爆全场的《羊了个羊》游戏，相信大家都玩过了，那么在玩这个游戏的同时，我想大家都会好奇这个游戏的实现，本文就带大家使用css,html,js来实现一个动物版的游戏。",
-    "url": "https://segmentfault.com/a/1190000042502121",
-    "author": "夕水",
-    "home_url": "https://segmentfault.com/u/xishui_5ac9a340a5484",
-    "votes": "11",
-    "rank": 12
+    "title": "AI数字绘画 stable-diffusion 保姆级教程",
+    "description": "简介————————近段时间来，你可能在不少地方都看到了非常多这样的好看的画。比如这样的赛博朋克风prompt: Cyberpunk, 8k resolution, castle, the rose sea, dream水墨画风格prompt: a watercolor ink painting of...",
+    "url": "https://segmentfault.com/a/1190000042450560",
+    "author": "程序员秋风",
+    "home_url": "https://segmentfault.com/u/qiufeng_5a07f6cb96ee0",
+    "votes": "8",
+    "rank": 13
   },
   {
     "title": "盘点一些好用的 JS 单行代码",
@@ -114,7 +123,7 @@
     "author": "前端小智",
     "home_url": "https://segmentfault.com/u/minnanitkong",
     "votes": "13",
-    "rank": 13
+    "rank": 14
   },
   {
     "title": "SegmentFault 思否技术征文丨浅谈 Java 进阶之路",
@@ -123,15 +132,6 @@
     "author": "SegmentFault思否",
     "home_url": "https://segmentfault.com/u/segmentfault",
     "votes": "9",
-    "rank": 14
-  },
-  {
-    "title": "AI数字绘画 stable-diffusion 保姆级教程",
-    "description": "简介————————近段时间来，你可能在不少地方都看到了非常多这样的好看的画。比如这样的赛博朋克风prompt: Cyberpunk, 8k resolution, castle, the rose sea, dream水墨画风格prompt: a watercolor ink painting of...",
-    "url": "https://segmentfault.com/a/1190000042450560",
-    "author": "程序员秋风",
-    "home_url": "https://segmentfault.com/u/qiufeng_5a07f6cb96ee0",
-    "votes": "7",
     "rank": 15
   },
   {
@@ -143,15 +143,6 @@
     "votes": "9",
     "rank": 16
   },
-  {
-    "title": "用node从零做个管理shell命令的好用工具, 正好温习下commander.js相关内容",
-    "description": "你有没有经历过忘记某个shell命令怎么拼写? 或是懒得打一长串命令的经历? 比如我的mac笔记本的tachbar偶尔会'卡死', 这时我就要输入 killall ControlStrip 命令重启tachbar, 你也看到了这个命...",
-    "url": "https://segmentfault.com/a/1190000042353870",
-    "author": "lulu_up",
-    "home_url": "https://segmentfault.com/u/lulu_up",
-    "votes": "10",
-    "rank": 17
-  },
   {
     "title": "怎么防止同事用 Evil.js 的代码投毒",
     "description": "视频移步B站[链接]最近Evil.js被讨论的很多，项目介绍如下项目被发布到npm上后，引起了激烈的讨论，最终因为安全问题被npm官方移除，代码也闭源了作为一个前端老司机，我肯定是反对这种行为，泄私愤有很多种方式...",
@@ -159,7 +150,7 @@
     "author": "前端小菜鸟",
     "home_url": "https://segmentfault.com/u/qianduanxiaocainiao_5c612df9514ba",
     "votes": "8",
-    "rank": 18
+    "rank": 17
   },
   {
     "title": "你不知道的 console，让 JS 调试更简单",
@@ -168,7 +159,7 @@
     "author": "高志鹏",
     "home_url": "https://segmentfault.com/u/gaozhipeng",
     "votes": "10",
-    "rank": 19
+    "rank": 18
   },
   {
     "title": "CodeForBetter_Hackathon，唤醒代码的力量",
@@ -177,7 +168,7 @@
     "author": "SegmentFault思否",
     "home_url": "https://segmentfault.com/u/segmentfault",
     "votes": "4",
-    "rank": 20
+    "rank": 19
   },
   {
     "title": "有意思的水平横向溢出滚动",
@@ -186,7 +177,7 @@
     "author": "chokcoco",
     "home_url": "https://segmentfault.com/u/chokcoco",
     "votes": "6",
-    "rank": 21
+    "rank": 20
   },
   {
     "title": "精读《SolidJS》",
@@ -195,7 +186,7 @@
     "author": "黄子毅",
     "home_url": "https://segmentfault.com/u/aoyangyudakong",
     "votes": "5",
-    "rank": 22
+    "rank": 21
   },
   {
     "title": "有意思的方向裁切 overflow: clip",
@@ -204,7 +195,7 @@
     "author": "chokcoco",
     "home_url": "https://segmentfault.com/u/chokcoco",
     "votes": "5",
-    "rank": 23
+    "rank": 22
   },
   {
     "title": "SegmentFault 思否技术周刊—关于 JavaScript 给你看点有用的！",
@@ -213,7 +204,7 @@
     "author": "Beverly",
     "home_url": "https://segmentfault.com/u/beverly0",
     "votes": "3",
-    "rank": 24
+    "rank": 23
   },
   {
     "title": "为什么vue.config.js中使用require，而vite.config.js使用 import?",
@@ -222,7 +213,7 @@
     "author": "寒水寺一禅",
     "home_url": "https://segmentfault.com/u/xiaolizideyitian",
     "votes": "8",
-    "rank": 25
+    "rank": 24
   },
   {
     "title": "用Vue.js写一个命令行贪吃蛇游戏",
@@ -231,6 +222,15 @@
     "author": "null仔",
     "home_url": "https://segmentfault.com/u/xiaoqianduan_58b28cfebff36",
     "votes": "5",
+    "rank": 25
+  },
+  {
+    "title": "近期对前端性能优化的总结",
+    "description": "前端性能优化不管是在面试中还是在实际开发过程中，都是每一个前端开发工程师都必不可少的能力。本文总结本人多年开发经验中对前端性能优化的理解，希望对大家有所帮助，因涉及的优化方向较多，针对某些细节不再...",
+    "url": "https://segmentfault.com/a/1190000042461022",
+    "author": "南城大前端",
+    "home_url": "https://segmentfault.com/u/nanchengfe",
+    "votes": "4",
     "rank": 26
   },
   {