V2EX - 技术

推荐下你看过的优质 golang 实战视频呗
CRC-32 查表法真的存在吗？
数据库设计太拉跨被喷了。
求教 RHEL6 操作系统支持升级到哪个版本的 Kernel？
如何实现像这个网站一样的反调试效果
哪个券商或托管平台支持 A 股自动打新
UDP Socket 失效
昂达 H61C V8 主板在 winxp 7 8 10 下睡眠后无法唤醒 hdmi 电视，在 bios 和 vista 和 Linux 下无此问题
朋友遇到一个面试题，微信朋友圈怎么设计？
Fower: 一个可在 Vue 和 React 方便使用的 CSS in JS 库
五一后计划用两个月的时间组织一个读 vue3 源码讨论会
怎么避免怯场，或者是说提高自己的沟通技巧
B/S 应用的开发分工能做到前后端分离么？
写了一个 [带 Intel 硬件加速的 ffmpeg] 的 Dockerfile
谷歌 FA 申请，绑定到站点上也是 recapcha 吗？
Vue/JavaScript 中如何了解一个方法的全部参数列表和解释？
如何调试 npm run build？
为什么我的 typora 上的文章不能直接复制粘贴到公众号呢？
Ajax 请求的如何优雅的 loading
做个小调研:如果只选一个，你的电脑上会安装那款需要付费的工具软件?
Vue 如何同时触发两个叠在一起的 div 的点击事件？
关于 es 分段合并的问题？
es6 进行段合并这样做对吗？
有关 required 的问题
CabloyJS 实现了一款基于 X6 的工作流可视化编辑器
[右手网出品视频]Android 12 DP 3 系统底层以及 UI 层面变化详细梳理
纯小白，想学习 Java 编程，有没有好的 Java 书籍推荐
提醒一下威联通用户，注意防范勒索病毒
请教个问题，阿里云服务器对接 google api 有什么好方法吗？
在本机用 Python 做数据挖掘，大家一般用什么数据库？
Manjaro 发行版入门短视频集
[疑问] 既然编译器会为自动为类添加无参构造函数，那么为什么父类还需要一个无参构造方法以供子类调用？(如果子类没有使用 super 调用)
一加 7 升级到安卓 11， B 站缓存列表不显示以前的下载记录
Github 高星项目翻译：如何成为一名后端开发工程师
6 个技巧和最佳实践提高 React 项目可拓展性
未 Root MIUI 里应用数据的自动化备份方案

Posted: 23 Apr 2021 04:01 AM PDT

Posted: 23 Apr 2021 03:53 AM PDT

看了这个视频发现 CRC-8 可以通过查表法查，方法是查表得到的 CRC-8 值 XOR 输入的数据，得到的数值作为表的索引找到新的 CRC 值不断循环得到最终的 CRC-8 值，但是 CRC-32 查表法要不止 256 个索引吧，那 CRC-32 查表法不就不存在吗

数据库设计太拉跨被喷了。

Posted: 23 Apr 2021 03:49 AM PDT

发现都是些智障问题，总结一下。

表内创建人字段和更新人字段，只存了 name，没有存人的 Id 。当时想着是应该只关心是谁做的操作，所以没有加入 id 的关联关系。但是实际上在表设计中有关联关系但是不存关联信息的数据干脆就不存，要存就都存。
关联表的索引关系一定要明确，该做约束的约束。该设置必输的设置必输。
部分在代码中或者项目里比较高频的字段，表设计时最好加_info 。
英文尽量要合理比如创建人不应该是 create_name 合理的应该是 creator_name，这块当时设计的时候想的是 creator_name，但是为了和创建时间和更新时间对应就统一变成了 create_name 和 lst_name 。

目前统计下来应该都是类似的问题。我数据库设计确实拉跨，可能是因为之前做的东西过度松散，对于数据库设计基本都是能用就行，关联表的约束关系可能都没有做全，全靠代码来做。还有很多细节上的问题。其实每次开发都是很快很简单，但是表设计真的让我头大。

求教 RHEL6 操作系统支持升级到哪个版本的 Kernel？

Posted: 23 Apr 2021 03:45 AM PDT

非核心业务，主要用于应付漏洞扫描的，所以不用管稳定性！目前已使用 elrepo 源升级内核至 4.18.9-1.el6.elrepo.x86_64，应该也是 elrepo 源最后一个支持 RHEL6 的内核版本了，但使用绿盟漏洞扫描还是扫出了 Kernel 漏洞！目前 Linux Kernel 最新稳定版是 5.11.16 ，求教 RHEL6 操作系统最多支持升级到哪个版本的 Kernel ？

如何实现像这个网站一样的反调试效果

Posted: 23 Apr 2021 03:33 AM PDT

https://www.agefans.net/play/20160120?playid=3_1

打开控制台就跳转页面了，网上能搜到的信息都是会利用 debugger 停住页面，没有直接跳转的。

哪个券商或托管平台支持 A 股自动打新

Posted: 23 Apr 2021 03:05 AM PDT

迫于经常错过打新,所以想找个支持自动打新的平台

主要是 A 股股票+债券
券商或者大型托管平台都行

UDP Socket 失效

Posted: 23 Apr 2021 02:59 AM PDT

有个客户反馈断网后软件没有自动重连，查看 log 后发现一直在发消息，只是一直没发出去。于是我把网线反复插拔测试，都没有出现重连失败的问题。他那边关开网关也不会有问题，出问题的场景是网络重新拨号后才会产生，他还说他们用了 AC 。不知道有没有人有过相关经验。似乎解决方案只能是 timeout 后重新创建 UDP socket，甚至重启进程。

昂达 H61C V8 主板在 winxp 7 8 10 下睡眠后无法唤醒 hdmi 电视，在 bios 和 vista 和 Linux 下无此问题

Posted: 23 Apr 2021 02:51 AM PDT

win7 卸载 intel 显卡驱动保留 hdmi audio 无此问题，可以在开机状态下拔下 HDMI 线，过几分钟再插上去，winxp 7 8 10 就一直黑屏，但是在 bios 和 vista 和 linux 下无此问题，但是刚拔下再插上就没事，重启后电视又可以显示，怀疑是显卡驱动的问题，但是更新多个版本也没有解决，求高手帮忙

配置是

CPU
Processor Name: Intel Core i3-2120
散热器
主板
Motherboard Model: Onda technology corporation H61C
内存
Module Part Number: RMR1810EC58E8F1333
显卡
Video Chipset: Intel HD Graphics 2000
硬盘
Drive Model: Seagate ST3500413AS
机箱
GreatWall R10
电源
GreatWall R10
显示器
Monitor Name: Sharp [Unknown Model: SHP3884]

朋友遇到一个面试题，微信朋友圈怎么设计？

Posted: 23 Apr 2021 02:48 AM PDT

假设微信朋友圈的
读 QPS 100w
写 QPS 10w
每个用户最多 400 个朋友，
发朋友圈和刷朋友圈该怎么设计？
数据怎么存储？
求大佬解答。

Fower: 一个可在 Vue 和 React 方便使用的 CSS in JS 库

Posted: 23 Apr 2021 02:43 AM PDT

今天给大家介绍一个我断断续续花了半年开发的 CSS 项目： Fower.

Fower 是什么？

Fower 是一个让你高效开发 UI 的样式工具库，目标是让你写 CSS 不再痛苦。Fower 的核心特点是原子化(Atomic/utility-first)、类型安全(Type Safe)、CSS in JS，它非常注重开发体验，让你快速且开心的开发界面。

Fower 是框架无关的，你可以在 React 、Vue 、React native 、小程序等任何 JavaScript 项目中使用。

项目背景

一年前，我所在的团队同时在开发 Web 、React native 、小程序项目。在这三类项目中，我们使用了各不相同的样式方案：

在 Web 项目中，我们使用的是 Styed-component ；
在 React native 项目中，我们使用 React native 自带的 StyleSheet.create；
在小程序项目中，我们使用 Taro 开发，样式方案是 Sass;

三种样式的方案写法各不相同，导致我们编写样式时特别痛苦：

开发体验差，开发同样的界面，却要不同的写法，需要不断切换习惯和思维
工具链太广太复杂，Styled-component 、Sass 、StyleSheet.create...
开发效率低下，重复代码特别多
CSS 天生缺点多，可维护性差

后面，我发现了 Tailwindcss，一个 utility 优先(utility-first) 的 CSS 框架，在我的推动下，我们团队开始在 Web 项目中使用 Tailwindcss 。一段时间后，我们发现开发体验很不错，开发效率也很高，特别适合在我们这种需要高度定制界面的项目使用。可惜的是，Tailwindcss 无法直接在 React native 、小程序等非 Web 项目使用。

我们团队的成员都喜欢 Tailwindcss 这种样式写法。所以我创建了 Fower，希望能统一了所有项目的样式编写方式。

和 Tailwindcss 类似，我们也使用了 utility-first 的理念，但有 Fower 又有点不同，Fower 使用 Atomic style props 的方式编写样式，代码如下：

<div toCenterY p-10 w-260 rounded-10 shadow>   <img circle-48 src="/img/jobs.jpg" />   <div ml-10>     <div textXL fontBold>Steve Jobs</div>     <span gray800>Co-founder of Apple Inc.</span>   </div> </div>

核心理念

Fower 是 opinionated 的，我们基于以下理念创建了它：

utility-first，这种方式让我们更快速地编写样式，和其他 "utility-first" CSS 框架不同的是，Fower 使用 "Atomic style prop" 编写样式
Type safe，我们团队是 TypeScript 重度使用用户，Type safe 带来的智能提示，让我们几乎很少翻阅文档，并且在编写代码时不依赖任何编辑插件就有准确的自动补全
Framework-agnostic，这是我们创建 Fower 的最主要原因之一，Fower 可以让你用一致的写法在 React 、Vue 、React Native 编写样式
CSS in JS，我们讨厌在独立的 CSS 文件中编写 CSS，纯 CSS 有非常多缺点，如：无法访问 JS 变量；容易产生样式冲突；容易产生死代码... 我们喜欢使用 JS (CSS in JS) 编写样式，它更适合在组件化时代中使用。实际上，Fower 不仅仅是 CSS in JS，它也是 CSS in HTML 。

一些很酷的特性

Fower 有非常多的特性，如原子类、响应式、伪类、主题、设计系统、CSS in JS...，我觉这些是 Fower 的基础功能，并不是特色功能。

Fower 有几个我认为很酷的功能：

1. Layout Toolkit

如果要我在 Fower 中选一个最喜欢的特性，那毫无疑问是 Layout Toolkitd。

Fower 提供了一个强大的基于 Flexdiv 的布局工具，通过调整布局的方向(Direction)和对齐(Alignment)，可以实现大部分的布局，使布局工作更轻松。

相比传统的 flex 布局，Fower 的布局更加抽象精简，Fower 的布局抽象为 toCenter、toCenterX、toCenterY、toLeft、toTop、toRight、toBottom、toBetween、toEvenly、toAround 十种原子对齐方式，使用时你可以忘记传统 flex 布局中的主轴（ main axis ）和交叉轴（ cross axis ）的概念，你只需要有方向感即可。

使用方式如下：

<div toCenter bgGray100 square-200>   <div square-60 bgAmber400 rounded-8></div>   <div square-80 bgBlue400 rounded-8></div> </div>

更详细的使用方法请看文档： Layout Toolkitd。

2. Predictable style

另外一个我个人很喜欢的特性的是 Predictable style 。在传统的 CSS 中，我认为样式是不可预测的。为什么这么说？这里举个例子。

我们有如下的 CSS:

.red {   color: red; } .blue {   color: blue; }

有如下的的 html, css 类名分别为 "red blue" 和 "blue red"：

<div>   <span className="red blue">Fower</span>   <span className="blue red">Fower</span> </div>

你能确定文字的颜色吗？不好确定，如果我们不翻看上面的 CSS 代码，你无法直接判断文字的颜色，只能通过开发者工具调试得知。

在 Flower 中，你可以轻易判断下面文字的颜色：

<div>   <span red400 blue400> text will be color blue400 </span>   <span blue400 red400> text will be color red400 </span> </div>

这有什么用呢？除了让我们更容易判断样式结果，我觉的最有用的是：当我们抽象出一个可复用的组件时，比如一个通用的 Button, 那调用方可以轻易的覆盖组件默认样式，比如这样类似的代码 <Button bgRed300></Button> 可以安全的设置背景色。

更详细的使用方法请看文档：Predictable style。

3. 颜色助手

Fower 的另一个很酷的功能是颜色助手，您可以使用一些后缀来处理颜色。

使用 --D{0-100} 这样的后缀来加深一个颜色:

<div toEvenly toCenterY>   <div red300>normal</div>   <div red300--D40>darken</div>   <div color="#fff--D40">darken</div>   <div bgRed300 square-84></div>   <div bgRed300--D40 square-84></div>   <div border borderRed300 square-84></div>   <div border borderRed300--D40 square-84></div> </div>

使用 --L{0-100} 后缀来变浅一个颜色：

<div toEvenly>   <div red500>normal</div>   <div red500--T40>transparentize</div>   <div color="#000--T40">transparentize</div>   <div bgRed500 square-84></div>   <div bgRed500--T40 square-84></div>   <div border borderRed300 square-84></div>   <div border borderRed300--T40 square-84></div> </div>

使用 --T{0-100} 后缀来增加颜色的透明度：

<div toEvenly>   <div red500>normal</div>   <div red500--T40>transparentize</div>   <div color="#000--T40">transparentize</div>   <div bgRed500 square-84></div>   <div bgRed500--T40 square-84></div>   <div border borderRed300 square-84></div>   <div border borderRed300--T40 square-84></div> </div>

使用 --O{0-100} 后缀来增加颜色的不透明度：

<div toEvenly>   <div color="rgba(0,0,0,0.4)">0.4</div>   <div color="rgba(0,0,0,0.4)--O40">Opacify to 0.6</div>   <div bg="rgba(0,0,0,0.4)" square-84></div>   <div bg="rgba(0,0,0,0.4)--O40" square-84></div>   <div border borderColor="rgba(0,0,0,0.4)" square-84></div>   <div border borderColor="rgba(0,0,0,0.4)--O40" square-84></div> </div>

更详细的使用方法请看文档：Color helper。

4. 可组合的后缀

Fower 提供一些后缀来快速处理样式, 如: --hover, --focus, --sm, --dark, --T{amount}...

Flower 的另一个很酷的功能是可组合的后缀。您可以组合一些后缀，并且顺序是任意的:

<div square-84 bgOrange300 bgOrange400--D10--hover--sm></div>

下面的代码和上面是等价的：

<div square-84 bgOrange300 bgOrange400--hover--sm--D10></div>

最后

如果你想了解更多关于 Fower 的信息，你可以访问项目网站和官方文档。

项目地址： ( https://github.com/forsigner/fower)[https://github.com/forsigner/fower]
项目文档：( https://fower.vercel.app)[https://fower.vercel.app]

五一后计划用两个月的时间组织一个读 vue3 源码讨论会

Posted: 23 Apr 2021 02:36 AM PDT

看完 vuex 源码后 https://www.bilibili.com/s/video/BV1Vi4y1A72u 增加了些读源码的信心。五一后计划用两个月时间把 vue3 的源码读一下，组织一个读 vue3 源码讨论会，有兴趣讲或者有精力读完并讨论的朋友可以加我微信 base64(eXVhbnNkdQ==)。

主题	主讲人	时间
snabbdom 源码分享		2021-04-24
Vue3 实践		2021-05-16
vue3/reactivity 源码		2021-05-23
vue3/runtime-core 源码		2021-05-30
vue3/runtime-dom 源码		2021-06-06
vue3/compiler-core 源码		2021-06-13
vue3/compiler-dom 源码		2021-06-20

可以通过 https://github.com/jiweiyuan/frontend 进一步了解。

顺便给大家推荐《 The Art of Unix Programming 》作者 E.S.R http://www.catb.org/esr/faqs/hacking-howto.html 一文

怎么避免怯场，或者是说提高自己的沟通技巧

Posted: 23 Apr 2021 02:30 AM PDT

自己属于不熟或者人多就容易怯场，从小到大就属于游戏宅，内心世界很丰富，但是人多就容易大脑宕机，也是很容易脸红平时业务需求沟通和迭代评审之类的场景也是

或者是大哥大姐们有什么读书分享会或者讲故事群或者活动拉拉小弟

B/S 应用的开发分工能做到前后端分离么？

Posted: 23 Apr 2021 02:29 AM PDT

经常听到有人讨论前后端分离，那么大家对前后端分离的工作区分和理解的呢？

有人说，前后端分离，前端只需要专注于前端，对于后端是用什么开发的不用管，前端只需要后端 Api 接口就可以，但这个说法可以推广到所有的 Web 应用+客户端开发吗？

如果是 b/s 端的话，前后端分离的话，按前端只需管后端 api 的说法，好像有点矛盾啊，B/s 端的客户端，也就是浏览器上显示的网页，不都是从服务端上拿过来的吗？如果前后端分离，网页都是从服务器上拿过来的，那还叫什么前后端分离？

B/S 端的前后端分离并不能彻底做到把。用户通过浏览器打开 Web 应用，应用的第一个网页或者说登录入口网页是从哪来的？ B/S 应用开发的话，前端肯定得接触到后端除了 api 接口之外的东西吧？比如后端模板引擎渲染的页面。

c/s 端的才能做到彻底的前后端分离把，比如 android，electron,wpf，其用户打开客户端所看到的的界面原本都在本地，这样的环境下，前端才能真正可以只管后端 Api 吧，不用必须从服务端拿网页。

写了一个 [带 Intel 硬件加速的 ffmpeg] 的 Dockerfile

Posted: 23 Apr 2021 02:05 AM PDT

手上有台 i3-7100T，最近用 ffmpeg-libx265 转码，2 小时的蓝光电影要转 6 小时；网上查了一下 Intel 芯片集成了硬件编解码 qsv，但是需要重新编译 ffmpeg ；所以我动手搞了搞，实测 hevc_qsv 编码 2 小时蓝光电影只需 40 分钟，体积没比 libx265 大多少，清晰度调到 18 肉眼看不出来；现将 Dockerfile 分享给大家： https://github.com/aihy/ffmpeg_qsv_docker

谷歌 FA 申请，绑定到站点上也是 recapcha 吗？

Posted: 23 Apr 2021 01:41 AM PDT

找不到哪里可以申请，但是 recapcha 申请没问题。

Vue/JavaScript 中如何了解一个方法的全部参数列表和解释？

Posted: 23 Apr 2021 01:21 AM PDT

经常查看别人的 JavaScript 代码时，发现"嗯？这方法还有这个参数？"

比如在 Vue 的 API 文档中：
Vue.extend( options )
* 参数:{Object} options
* 用法：使用基础 Vue 构造器，创建一个"子类"。参数是一个包含组件选项的对象。
接下只介绍了 extend 的主要用法。

这里的 options 展开之后的全部参数和解释在哪里可以看到呢？

如何调试 npm run build？

Posted: 23 Apr 2021 01:03 AM PDT

打包项目的时候出错，已排除项目的问题，求问如何打断点调试？谢谢！

为什么我的 typora 上的文章不能直接复制粘贴到公众号呢？

Posted: 23 Apr 2021 12:09 AM PDT

我记得我以前分明是可以的。

这次复制粘贴过来的，全部是代码啊。根本不是我想要的效果 https://wx4.sinaimg.cn/mw690/65f45f17gy1gptdqbqar0j20ht0ch74v.jpg

Ajax 请求的如何优雅的 loading

Posted: 22 Apr 2021 11:21 PM PDT

Ajax 请求前总是要需要一个 loading 变量来

防止重复点击
开启 loading 效果

那么这个 loading 的最佳实践是啥？每一个 Ajax 都要写一个 loading，感觉每次重复写很蛋疼,

并不能用 axios 的全局拦截器，那样只能全局 loading，实例中又很难拿到这个状态来作 防止重复点击

用 vue 写个示例代码

<template> 	<div> 		<div class="del" v-loading="loading.del"></div> 		<div class="list" v-loading="loading.list"></div> 	</div> </template> <script> export default { 	name: '', 	data: () => ({ 		loading: { 			del: false, 			list: false, 		}, 	}),     methods:{         ajaxDel(){             const {loading} = this;  // <--- 这一坨             if (loading.del) return ; // <--- 这一坨             loading.del = true; // <--- 这一坨              ajax.get('/del')                 .then(() => {...})                 .catch(() => {...})                 .finally(() => {                     loading.del = false;  // <--- 这一坨                 })         },         ajaxDel(){             const {loading} = this;             if (loading.list) return ;             loading.list = true;              ajax.get('/list')                 .then(() => {...})                 .catch(() => {...})                 .finally(() => {                     loading.list = false;                 })         }     } }; </script>

做个小调研:如果只选一个，你的电脑上会安装那款需要付费的工具软件?

Posted: 22 Apr 2021 10:55 PM PDT

RT...

Vue 如何同时触发两个叠在一起的 div 的点击事件？

Posted: 22 Apr 2021 10:32 PM PDT

如题，有两个 div，用 absolute 排版，重叠在一起，两层各自绑定了一些响应事件，想要做到点击的时候同时触发两个 div 的事件，应该怎么操作？

百度了一下说是设置 style="pointer-events:none;" 试了之后发现，加上以后确实能穿透下层了，但是上层的点击事件直接被忽略了。有能同时触发两个的方法吗？

关于 es 分段合并的问题？

Posted: 22 Apr 2021 10:27 PM PDT

目前一个存储用户信息的索引已经有 40 多个 G，期间通过 POST 索引名 /_delete_by_query 删除了大量数据，占用空间反尔加大了不少，目前想通过_forcemerge?only_expunge_deletes=true&max_num_segments=1 来合并段，不确定做法对不对？

1 、先通过"index.blocks.write": true 将索引设置成只读 2 、执行_forcemerge?only_expunge_deletes=true&max_num_segments=1 3 、"index.blocks.write": fase 设置成读写

目前此索引不停的有新数据写入，打算在凌晨进行操作，另外这个操作耗时大概会多久？

es6 进行段合并这样做对吗？

Posted: 22 Apr 2021 09:21 PM PDT

目前一个存储用户信息的索引已经有 40 多个 G，期间通过 POST 索引名 /_delete_by_query 删除了大量数据，占用空间反尔加大了不少，目前想通过_forcemerge?only_expunge_deletes=true&max_num_segments=1 来合并段，不确定做法对不对？ 1 、先通过"index.blocks.write": true 将索引设置成只读 2 、执行_forcemerge?only_expunge_deletes=true&max_num_segments=1 3 、"index.blocks.write": fase 设置成读写

目前此索引不停的有新数据写入，打算在凌晨进行操作，另外这个操作耗时大概会多久？

有关 required 的问题

Posted: 22 Apr 2021 07:57 PM PDT

验证时不使用 required，为什么不输入时 checkValidity() 会返回 true?

CabloyJS 实现了一款基于 X6 的工作流可视化编辑器

Posted: 22 Apr 2021 07:02 PM PDT

介绍

文档演示：CMS 审批工作流演示了如何通过JSON来直接创建一个工作流定义，通常用于为具体的业务数据生成预定义或内置审批工作流的场景

CabloyJS 4.8.0 采用X6 图编辑引擎实现了一款工作流可视化编辑器，从而可以在系统运行过程中，随时、动态、可视化的创建工作流定义

特别要感谢X6提供了非常强大的图编辑引擎，而且也提供了非常灵活的开发接口和扩展接口。基于 X6 的有力支撑，工作流可视化编辑器的复杂部分反而不再是图编辑本身了，而是各个节点的属性编辑表单，以及表单背后的 API 接口的配套支持

如果大家对X6 图编辑引擎有兴趣，一定要看看 CabloyJS 4.8.0，这会是一个非常清晰的入门案例

e-techbytes

Friday, April 23, 2021

V2EX - 技术

V2EX - 技术

Fower 是什么？

项目背景

核心理念

一些很酷的特性

1. Layout Toolkit

2. Predictable style

3. 颜色助手

4. 可组合的后缀

最后

介绍

演示

Mobile

PC

相关链接

No comments:

Post a Comment