@wcj/github-rank 22.6.11 → 22.6.12

package/web/sifou-monthly.html

@@ -116,7 +116,7 @@
     
     
   </h1>
-  <div class="time">Last cache created on 2022/6/11 by 
+  <div class="time">Last cache created on 2022/6/12 by 
     
     
     
@@ -203,34 +203,6 @@
     <div class="info">
       <div class="rank">
         <span title="Ranking 3">3</span>
-        <a href="https://segmentfault.com/a/1190000041833326" target="_blank" title="为什么前端不能没有监控系统？">为什么前端不能没有监控系统？</a>
-      </div>
-      <div class="sub-title followers">
-        
-        <span title="Stargazers Count">
-          <svg width="12" height="12" viewBox="0 0 16 16">
-            <g fill="none" fill-rule="evenodd">
-              <path d="M0 0h16v16H0z"/>
-              <path fill="#9E9E9E" d="M4.234 6.693v7.243H2.881c-.486 0-.881-.492-.881-1.095V7.875c0-.63.412-1.182.88-1.182h1.354zm3.688-3.7C8.01 2.404 8.49 1.99 9.018 2c.754.015 1.204.663 1.36.983.284.585.292 1.549.097 2.167-.177.56-.586 1.296-.586 1.296h3.066c.324 0 .625.164.826.449.204.29.27.668.178 1.011l-1.387 5.183c-.126.499-.544.847-1.016.847H5.53V6.693c1.385-.309 2.236-2.632 2.392-3.7z"/>
-            </g>
-          </svg>
-          <span>31</span>
-        </span>
-        &nbsp;
-        <a target="_blank" href="https://segmentfault.com/u/ruidoc"  title="Programming Language">
-          <span>杨成功</span>
-        </a>
-      </div>
-      <div class="details">
-        提到监控系统，大部分同学首先想到的是后端监控。很明显，比如检测服务器性能，数据库性能，API 的访问流量，以及各种服务的运行情况等等，都与后端息息相关。而前端更多承担的是 UI 展现的角色，主要关注页面怎...
-      </div>
-    </div>
-  </li>
-  
-  <li>
-    <div class="info">
-      <div class="rank">
-        <span title="Ranking 4">4</span>
         <a href="https://segmentfault.com/a/1190000041881142" target="_blank" title="如何实现一个能精确同步滚动的Markdown编辑器">如何实现一个能精确同步滚动的Markdown编辑器</a>
       </div>
       <div class="sub-title followers">
@@ -258,7 +230,7 @@
   <li>
     <div class="info">
       <div class="rank">
-        <span title="Ranking 5">5</span>
+        <span title="Ranking 4">4</span>
         <a href="https://segmentfault.com/a/1190000041860587" target="_blank" title="浅谈逻辑选择器 -- 父选择器它来了！">浅谈逻辑选择器 -- 父选择器它来了！</a>
       </div>
       <div class="sub-title followers">
@@ -286,7 +258,7 @@
   <li>
     <div class="info">
       <div class="rank">
-        <span title="Ranking 6">6</span>
+        <span title="Ranking 5">5</span>
         <a href="https://segmentfault.com/a/1190000041925107" target="_blank" title="归零进一 | SegmentFault 思否社区 10 周年社区福利来了！">归零进一 | SegmentFault 思否社区 10 周年社区福利来了！</a>
       </div>
       <div class="sub-title followers">
@@ -314,7 +286,7 @@
   <li>
     <div class="info">
       <div class="rank">
-        <span title="Ranking 7">7</span>
+        <span title="Ranking 6">6</span>
         <a href="https://segmentfault.com/a/1190000041861125" target="_blank" title="SegmentFault 思否技术周刊 -- Go 语言通关攻略">SegmentFault 思否技术周刊 -- Go 语言通关攻略</a>
       </div>
       <div class="sub-title followers">
@@ -342,7 +314,7 @@
   <li>
     <div class="info">
       <div class="rank">
-        <span title="Ranking 8">8</span>
+        <span title="Ranking 7">7</span>
         <a href="https://segmentfault.com/a/1190000041879217" target="_blank" title="前端监控的搭建步骤，别再一头雾水了！">前端监控的搭建步骤，别再一头雾水了！</a>
       </div>
       <div class="sub-title followers">
@@ -370,7 +342,7 @@
   <li>
     <div class="info">
       <div class="rank">
-        <span title="Ranking 9">9</span>
+        <span title="Ranking 8">8</span>
         <a href="https://segmentfault.com/a/1190000041947673" target="_blank" title="文字轮播与图片轮播？CSS 不在话下">文字轮播与图片轮播？CSS 不在话下</a>
       </div>
       <div class="sub-title followers">
@@ -398,7 +370,7 @@
   <li>
     <div class="info">
       <div class="rank">
-        <span title="Ranking 10">10</span>
+        <span title="Ranking 9">9</span>
         <a href="https://segmentfault.com/a/1190000041885333" target="_blank" title="关于代码评审(CodeReview)那些不得不说的事儿">关于代码评审(CodeReview)那些不得不说的事儿</a>
       </div>
       <div class="sub-title followers">
@@ -426,7 +398,7 @@
   <li>
     <div class="info">
       <div class="rank">
-        <span title="Ranking 11">11</span>
+        <span title="Ranking 10">10</span>
         <a href="https://segmentfault.com/a/1190000041887095" target="_blank" title="CSS 穿墙术！太强了">CSS 穿墙术！太强了</a>
       </div>
       <div class="sub-title followers">
@@ -454,7 +426,7 @@
   <li>
     <div class="info">
       <div class="rank">
-        <span title="Ranking 12">12</span>
+        <span title="Ranking 11">11</span>
         <a href="https://segmentfault.com/a/1190000041940807" target="_blank" title="CSS 实现头像名称首字符自动占位">CSS 实现头像名称首字符自动占位</a>
       </div>
       <div class="sub-title followers">
@@ -482,7 +454,7 @@
   <li>
     <div class="info">
       <div class="rank">
-        <span title="Ranking 13">13</span>
+        <span title="Ranking 12">12</span>
         <a href="https://segmentfault.com/a/1190000041789636" target="_blank" title="如何做新人引导功能？">如何做新人引导功能？</a>
       </div>
       <div class="sub-title followers">
@@ -510,7 +482,7 @@
   <li>
     <div class="info">
       <div class="rank">
-        <span title="Ranking 14">14</span>
+        <span title="Ranking 13">13</span>
         <a href="https://segmentfault.com/a/1190000041926662" target="_blank" title="十年老友记 | @张京：我编程了三十年，编程就是我的符号">十年老友记 | @张京：我编程了三十年，编程就是我的符号</a>
       </div>
       <div class="sub-title followers">
@@ -538,7 +510,7 @@
   <li>
     <div class="info">
       <div class="rank">
-        <span title="Ranking 15">15</span>
+        <span title="Ranking 14">14</span>
         <a href="https://segmentfault.com/a/1190000041921498" target="_blank" title="SegmentFault 思否技术周刊 -- JavaScript 的那些事">SegmentFault 思否技术周刊 -- JavaScript 的那些事</a>
       </div>
       <div class="sub-title followers">
@@ -566,7 +538,7 @@
   <li>
     <div class="info">
       <div class="rank">
-        <span title="Ranking 16">16</span>
+        <span title="Ranking 15">15</span>
         <a href="https://segmentfault.com/a/1190000041892645" target="_blank" title="SegmentFault 思否技术周刊 -- 进击的 React">SegmentFault 思否技术周刊 -- 进击的 React</a>
       </div>
       <div class="sub-title followers">
@@ -594,7 +566,7 @@
   <li>
     <div class="info">
       <div class="rank">
-        <span title="Ranking 17">17</span>
+        <span title="Ranking 16">16</span>
         <a href="https://segmentfault.com/a/1190000041843081" target="_blank" title="5分钟带你通过Javascript了解人工智能的基本原理">5分钟带你通过Javascript了解人工智能的基本原理</a>
       </div>
       <div class="sub-title followers">
@@ -622,35 +594,7 @@
   <li>
     <div class="info">
       <div class="rank">
-        <span title="Ranking 18">18</span>
-        <a href="https://segmentfault.com/a/1190000041831493" target="_blank" title="移动端常见适配方案">移动端常见适配方案</a>
-      </div>
-      <div class="sub-title followers">
-        
-        <span title="Stargazers Count">
-          <svg width="12" height="12" viewBox="0 0 16 16">
-            <g fill="none" fill-rule="evenodd">
-              <path d="M0 0h16v16H0z"/>
-              <path fill="#9E9E9E" d="M4.234 6.693v7.243H2.881c-.486 0-.881-.492-.881-1.095V7.875c0-.63.412-1.182.88-1.182h1.354zm3.688-3.7C8.01 2.404 8.49 1.99 9.018 2c.754.015 1.204.663 1.36.983.284.585.292 1.549.097 2.167-.177.56-.586 1.296-.586 1.296h3.066c.324 0 .625.164.826.449.204.29.27.668.178 1.011l-1.387 5.183c-.126.499-.544.847-1.016.847H5.53V6.693c1.385-.309 2.236-2.632 2.392-3.7z"/>
-            </g>
-          </svg>
-          <span>11</span>
-        </span>
-        &nbsp;
-        <a target="_blank" href="https://segmentfault.com/u/deepred5"  title="Programming Language">
-          <span>深红</span>
-        </a>
-      </div>
-      <div class="details">
-        做移动端页面有一段时间了，总结下工作中常用的几种移动端适配方案。基础网上已经有非常多的基础知识总结，不再赘诉，详情可以见《关于移动端适配，你必须要知道的》《不要再问我移动适配的问题了》其中容易搞混...
-      </div>
-    </div>
-  </li>
-  
-  <li>
-    <div class="info">
-      <div class="rank">
-        <span title="Ranking 19">19</span>
+        <span title="Ranking 17">17</span>
         <a href="https://segmentfault.com/a/1190000041905055" target="_blank" title="云原生时代 PHP/Golang 项目如何实现微服务">云原生时代 PHP/Golang 项目如何实现微服务</a>
       </div>
       <div class="sub-title followers">
@@ -678,8 +622,8 @@
   <li>
     <div class="info">
       <div class="rank">
-        <span title="Ranking 20">20</span>
-        <a href="https://segmentfault.com/a/1190000041832303" target="_blank" title="它来了！Flutter3.0发布全解析">它来了！Flutter3.0发布全解析</a>
+        <span title="Ranking 18">18</span>
+        <a href="https://segmentfault.com/a/1190000041921943" target="_blank" title="无需安装、注册，一行命令搞定内网穿透！关键是完全免费">无需安装、注册，一行命令搞定内网穿透！关键是完全免费</a>
       </div>
       <div class="sub-title followers">
         
@@ -690,15 +634,15 @@
               <path fill="#9E9E9E" d="M4.234 6.693v7.243H2.881c-.486 0-.881-.492-.881-1.095V7.875c0-.63.412-1.182.88-1.182h1.354zm3.688-3.7C8.01 2.404 8.49 1.99 9.018 2c.754.015 1.204.663 1.36.983.284.585.292 1.549.097 2.167-.177.56-.586 1.296-.586 1.296h3.066c.324 0 .625.164.826.449.204.29.27.668.178 1.011l-1.387 5.183c-.126.499-.544.847-1.016.847H5.53V6.693c1.385-.309 2.236-2.632 2.392-3.7z"/>
             </g>
           </svg>
-          <span>6</span>
+          <span>12</span>
         </span>
         &nbsp;
-        <a target="_blank" href="https://segmentfault.com/u/writers"  title="Programming Language">
-          <span>思否编辑部</span>
+        <a target="_blank" href="https://segmentfault.com/u/jishuroad"  title="Programming Language">
+          <span>民工哥</span>
         </a>
       </div>
       <div class="details">
-        我们很高兴地宣布，作为谷歌I/O主题演讲的一部分，我们今天推出了Flutter 3。Flutter 3完成了我们从以移动为中心到多平台框架的路线图，提供了对macOS和Linux桌面应用的支持，以及对Firebase集成的改进，新的生产...
+        内网穿透，即NAT穿透，网络连接时术语。外网与内网的计算机节点需要连接通信，映射端口能让外网的电脑找到处于内网的电脑，提高下载速度。内网穿透的应用场景web 应用开发向外网发布开发的一些web demo，或者远程...
       </div>
     </div>
   </li>
@@ -706,7 +650,7 @@
   <li>
     <div class="info">
       <div class="rank">
-        <span title="Ranking 21">21</span>
+        <span title="Ranking 19">19</span>
         <a href="https://segmentfault.com/a/1190000041894263" target="_blank" title="Base64 编码知识，一文打尽！">Base64 编码知识，一文打尽！</a>
       </div>
       <div class="sub-title followers">
@@ -734,8 +678,8 @@
   <li>
     <div class="info">
       <div class="rank">
-        <span title="Ranking 22">22</span>
-        <a href="https://segmentfault.com/a/1190000041921943" target="_blank" title="无需安装、注册，一行命令搞定内网穿透！关键是完全免费">无需安装、注册，一行命令搞定内网穿透！关键是完全免费</a>
+        <span title="Ranking 20">20</span>
+        <a href="https://segmentfault.com/a/1190000041943100" target="_blank" title="这个队列的思路是真的好，现在它是我简历上的亮点了。">这个队列的思路是真的好，现在它是我简历上的亮点了。</a>
       </div>
       <div class="sub-title followers">
         
@@ -746,15 +690,15 @@
               <path fill="#9E9E9E" d="M4.234 6.693v7.243H2.881c-.486 0-.881-.492-.881-1.095V7.875c0-.63.412-1.182.88-1.182h1.354zm3.688-3.7C8.01 2.404 8.49 1.99 9.018 2c.754.015 1.204.663 1.36.983.284.585.292 1.549.097 2.167-.177.56-.586 1.296-.586 1.296h3.066c.324 0 .625.164.826.449.204.29.27.668.178 1.011l-1.387 5.183c-.126.499-.544.847-1.016.847H5.53V6.693c1.385-.309 2.236-2.632 2.392-3.7z"/>
             </g>
           </svg>
-          <span>11</span>
+          <span>9</span>
         </span>
         &nbsp;
-        <a target="_blank" href="https://segmentfault.com/u/jishuroad"  title="Programming Language">
-          <span>民工哥</span>
+        <a target="_blank" href="https://segmentfault.com/u/whyjishu"  title="Programming Language">
+          <span>why技术</span>
         </a>
       </div>
       <div class="details">
-        内网穿透，即NAT穿透，网络连接时术语。外网与内网的计算机节点需要连接通信，映射端口能让外网的电脑找到处于内网的电脑，提高下载速度。内网穿透的应用场景web 应用开发向外网发布开发的一些web demo，或者远程...
+        你好呀，我是歪歪。前几天在一个开源项目的 github 里面看到这样的一个 pr：光是看这个名字，里面有个 MemorySafe，我就有点陷进去了。我先给你看看这个东西：这个肯定很眼熟吧？我是从阿里巴巴开发规范中截的图...
       </div>
     </div>
   </li>
@@ -762,7 +706,7 @@
   <li>
     <div class="info">
       <div class="rank">
-        <span title="Ranking 23">23</span>
+        <span title="Ranking 21">21</span>
         <a href="https://segmentfault.com/a/1190000041903331" target="_blank" title="Three.js 打造缤纷夏日3D梦中情岛 🌊">Three.js 打造缤纷夏日3D梦中情岛 🌊</a>
       </div>
       <div class="sub-title followers">
@@ -790,7 +734,7 @@
   <li>
     <div class="info">
       <div class="rank">
-        <span title="Ranking 24">24</span>
+        <span title="Ranking 22">22</span>
         <a href="https://segmentfault.com/a/1190000041881296" target="_blank" title="如何自定义 drag 样式">如何自定义 drag 样式</a>
       </div>
       <div class="sub-title followers">
@@ -818,7 +762,7 @@
   <li>
     <div class="info">
       <div class="rank">
-        <span title="Ranking 25">25</span>
+        <span title="Ranking 23">23</span>
         <a href="https://segmentfault.com/a/1190000041934586" target="_blank" title="全球顶级交易所前端二面">全球顶级交易所前端二面</a>
       </div>
       <div class="sub-title followers">
@@ -846,7 +790,7 @@
   <li>
     <div class="info">
       <div class="rank">
-        <span title="Ranking 26">26</span>
+        <span title="Ranking 24">24</span>
         <a href="https://segmentfault.com/a/1190000041855296" target="_blank" title="js面试题(进阶)梳理">js面试题(进阶)梳理</a>
       </div>
       <div class="sub-title followers">
@@ -874,7 +818,7 @@
   <li>
     <div class="info">
       <div class="rank">
-        <span title="Ranking 27">27</span>
+        <span title="Ranking 25">25</span>
         <a href="https://segmentfault.com/a/1190000041918155" target="_blank" title="锁定项目 Node 版本和包管理器">锁定项目 Node 版本和包管理器</a>
       </div>
       <div class="sub-title followers">
@@ -902,7 +846,7 @@
   <li>
     <div class="info">
       <div class="rank">
-        <span title="Ranking 28">28</span>
+        <span title="Ranking 26">26</span>
         <a href="https://segmentfault.com/a/1190000041926694" target="_blank" title="社区的力量 | SegmentFault 思否十周年，伙伴们说">社区的力量 | SegmentFault 思否十周年，伙伴们说</a>
       </div>
       <div class="sub-title followers">
@@ -930,7 +874,7 @@
   <li>
     <div class="info">
       <div class="rank">
-        <span title="Ranking 29">29</span>
+        <span title="Ranking 27">27</span>
         <a href="https://segmentfault.com/a/1190000041953821" target="_blank" title="云计算的未来在哪？破解亚马逊云科技增长神话">云计算的未来在哪？破解亚马逊云科技增长神话</a>
       </div>
       <div class="sub-title followers">
@@ -955,11 +899,67 @@
     </div>
   </li>
   
+  <li>
+    <div class="info">
+      <div class="rank">
+        <span title="Ranking 28">28</span>
+        <a href="https://segmentfault.com/a/1190000041914954" target="_blank" title="CSS 变量自动变色技术">CSS 变量自动变色技术</a>
+      </div>
+      <div class="sub-title followers">
+        
+        <span title="Stargazers Count">
+          <svg width="12" height="12" viewBox="0 0 16 16">
+            <g fill="none" fill-rule="evenodd">
+              <path d="M0 0h16v16H0z"/>
+              <path fill="#9E9E9E" d="M4.234 6.693v7.243H2.881c-.486 0-.881-.492-.881-1.095V7.875c0-.63.412-1.182.88-1.182h1.354zm3.688-3.7C8.01 2.404 8.49 1.99 9.018 2c.754.015 1.204.663 1.36.983.284.585.292 1.549.097 2.167-.177.56-.586 1.296-.586 1.296h3.066c.324 0 .625.164.826.449.204.29.27.668.178 1.011l-1.387 5.183c-.126.499-.544.847-1.016.847H5.53V6.693c1.385-.309 2.236-2.632 2.392-3.7z"/>
+            </g>
+          </svg>
+          <span>9</span>
+        </span>
+        &nbsp;
+        <a target="_blank" href="https://segmentfault.com/u/xboxyan"  title="Programming Language">
+          <span>XboxYan</span>
+        </a>
+      </div>
+      <div class="details">
+        欢迎关注微信公众号： 前端侦探在思否上看到这样一个设计，当阅读量比较少时，文字呈灰色，当阅读量比较多（&gt;=100）时，文字就变成褐色了，示意效果如下是不是非常醒目呢？另外，还有那种可以根据进度自动变色...
+      </div>
+    </div>
+  </li>
+  
+  <li>
+    <div class="info">
+      <div class="rank">
+        <span title="Ranking 29">29</span>
+        <a href="https://segmentfault.com/a/1190000041782911" target="_blank" title="13 个Typescript 实用类型：开发人员的备忘单">13 个Typescript 实用类型：开发人员的备忘单</a>
+      </div>
+      <div class="sub-title followers">
+        
+        <span title="Stargazers Count">
+          <svg width="12" height="12" viewBox="0 0 16 16">
+            <g fill="none" fill-rule="evenodd">
+              <path d="M0 0h16v16H0z"/>
+              <path fill="#9E9E9E" d="M4.234 6.693v7.243H2.881c-.486 0-.881-.492-.881-1.095V7.875c0-.63.412-1.182.88-1.182h1.354zm3.688-3.7C8.01 2.404 8.49 1.99 9.018 2c.754.015 1.204.663 1.36.983.284.585.292 1.549.097 2.167-.177.56-.586 1.296-.586 1.296h3.066c.324 0 .625.164.826.449.204.29.27.668.178 1.011l-1.387 5.183c-.126.499-.544.847-1.016.847H5.53V6.693c1.385-.309 2.236-2.632 2.392-3.7z"/>
+            </g>
+          </svg>
+          <span>14</span>
+        </span>
+        &nbsp;
+        <a target="_blank" href="https://segmentfault.com/u/minnanitkong"  title="Programming Language">
+          <span>前端小智</span>
+        </a>
+      </div>
+      <div class="details">
+        我们可以为 UserProfileResponse 定义类型，并为 LoginResponse 挑选一些属性，而不是定义相同上下文的 LoginResponse 和 UserProfileResponse 的类型。
+      </div>
+    </div>
+  </li>
+  
   <li>
     <div class="info">
       <div class="rank">
         <span title="Ranking 30">30</span>
-        <a href="https://segmentfault.com/a/1190000041943100" target="_blank" title="这个队列的思路是真的好，现在它是我简历上的亮点了。">这个队列的思路是真的好，现在它是我简历上的亮点了。</a>
+        <a href="https://segmentfault.com/a/1190000041895680" target="_blank" title="js 生成UUID的几种方法">js 生成UUID的几种方法</a>
       </div>
       <div class="sub-title followers">
         
@@ -973,12 +973,12 @@
           <span>8</span>
         </span>
         &nbsp;
-        <a target="_blank" href="https://segmentfault.com/u/whyjishu"  title="Programming Language">
-          <span>why技术</span>
+        <a target="_blank" href="https://segmentfault.com/u/xiaomogu_5f2124ad3ad42"  title="Programming Language">
+          <span>墨城</span>
         </a>
       </div>
       <div class="details">
-        你好呀，我是歪歪。前几天在一个开源项目的 github 里面看到这样的一个 pr：光是看这个名字，里面有个 MemorySafe，我就有点陷进去了。我先给你看看这个东西：这个肯定很眼熟吧？我是从阿里巴巴开发规范中截的图...
+        UUID(Universally Unique IDentifier) 全局唯一标识符。UUID是一种由算法生成的二进制长度为128位的数字标识符。UUID的格式为“xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx”，其中的 x 是 0-9 或 a-f范围内的一个32位十...
       </div>
     </div>
   </li>
@@ -999,7 +999,7 @@
         <img src="https://img.shields.io/npm/v/@wcj/github-rank.svg?label=unpkg">
       </a>
     </div>
-    <div class="time">Last cache created on 2022/6/11 by Github API v3.</div>
+    <div class="time">Last cache created on 2022/6/12 by Github API v3.</div>
     Create by <a href="https://github.com/jaywcjlove" target="_blank">小弟调调™</a>.
   </div>
 </body>