2023-08-16
随笔
前段时间刀郎一曲《罗刹海市》很是火爆,罗刹国里黑白颠倒,小伙马骥一番奇遇。
听了几次歌,B站就给我推了安森垚的视频,从罗刹一直聊到维特根斯坦。
你觉得罗刹海市说了点什么? - BiliBili
然而相比于罗刹本身,中间一段关于白马非马的解析让我有些豁然开朗。
白马非马是战国时期一哥们公孙龙的小故事。
话说这天公孙龙牵着一匹白马进城门,
门卫:马不让进。
龙子:这不是马,是白马。
门卫:白马不是马是什么,滚蛋。
2023-06-24
Coding
Typescript
Typescript一直保持着3个月一个release,从2021年5月至今发布了10个版本(5.2将在8月release)。
本文盘点各个版本中的主要更新,着重在语言特性,其他有关性能等其他方面的更新请自行查看路线图。
Typescript Roadmap
允许getter和setter指定不同的类型。
下例中,size是一个数字,但是同时setter可以接受字符串并转换。
2023-03-13
Coding
Frontend
CSS
最近碰到了一个神奇的问题,在一个overflow:auto的容器上点击滚轮(鼠标中键),导致整个页面卡住。
其实说卡住也不完全,因为可以进行TAB切换焦点等键盘操作,说明渲染引擎并没有卡死,而是页面无法交互。
经过一番Debug,终于找到了原因,下面给出一个最小复现例子。
BUG复现,测试使用Chrome Version 110.0.5481.177 (Official Build) (64-bit)
进入后拖动滚动条(绿色)可以正常左右滚动,但是当按下鼠标中键后整个TAB卡死。
2023-01-02
Coding
Javascript
WebGL
我最近在做WebGL相关的图表开发,主要使用Three.js(不过本文和Three.js无关)。
我遇到一个非常简单且典型的需求是散点图(Scatter),但是这在GL的世界并不容易。
散点图的点不同于普通的三维物体,其不具备透视性,即放大缩小后仍然保持原始的大小。
如果使用Mesh,则需要在缩放的时候动态调整大小,一方面很不方便,另一方面每一个圆点都是数十个三角形,对于大规模数据有性能方面的影响。
这时我注意到Three.js提供的Points物体,其具备了不透视的性质。
2022-12-26
生活
我已经阳了六天了,悦悦阳了三天。
好消息是我的手术卡在了爆发前,已经告一段落。
坏消息是六天了我还没好,头痛欲裂。
悦悦和我把这些天的各种症状和我们尝试的方法总结在此,供大家参考。
鼻腔和口腔,哪里难受捅哪里 —— 悦悦
我在有症状的第二天按照说明书指示捅鼻腔,但是得到的是一条杠阴性。
当时没有鼻塞等症状,而是咽痛。
在悦悦的建议下,第二天改为捅嗓子,一滴上去10秒钟就鲜红的两道杠。
后来又问了其他朋友,有好几个人也都是捅嗓子才阳的。
2022-08-18
Coding
Web
Chrome
React
Profile
最近进行了第一次深入的Web JS内存优化。遇到了一些问题在此记录。
许多工具和三方库会在开发模式下有特定的debug逻辑,可能会导致内存泄漏。
最好是在production模式下进行调试,但是即使如此,也有可能会受到干扰。
我在本次调试中发现了以下几点需要注意的外部环境问题
一些第三方库可能需要手动销毁对象,这通常是由于使用了ArrayBuffer等native对象。
例如Three.js,专门有一篇文档:如何废置对象
不过此类问题比较容易发现,也容易解决。
2022-07-09
数学
算法
扔鸡蛋问题是一道经典的算法题,LeetCode链接。
该题目下有很多算法详解,包括官方解答。
但是今天我们不聊动态规划,从数学的角度解决这个问题。
有kkk个鸡蛋,fff层楼,求最小次数n(k,f)n(k,f)n(k,f)。
易知,n(1,f)=fn(1,f) = fn(1,f)=f,即一个鸡蛋只能从一楼开始逐层尝试。
然而,当k=2k=2k=2的时候,问题就难以通过简单的心算来得到答案。但是容易观察到:
2022-04-11
Coding
Electron
Node.js
Webpack
JS以其单线程事件循环模型在UI和IO密集型应用中有着很好的表现相性。
但是当我们用Electron构建桌面应用时,不可避免地需要进行某些CPU密集的任务。
为了解决JS多线程的问题,WebWorker应运而生(MDN WebWorker)。
WebWorker是独立的工作者线程,它与主线程不共享任何状态,只通过事件通信。
类似的,在Node世界中,标准库为我们提供了worker_threads模块,其实现了与WebWorker相同的工作者。DOC
2022-03-17
Coding
Electron
ERB
React
Electron是基于Javascript构建桌面应用的框架。
而React是最流行的Javascript UI库。
为了能在Electron框架下更好地使用React,于是就有了
Electron React Boilerplate。
本文基于ERB-4.5.0版本。
ERB集成了丰富的特性,包括但不限于
这些内容都可以在官方文档中找到怎样使用,本文将不再赘述。
下面将详细讲解ERB的整体流程和各个组件如何协作,重在WHY,而不止于HOW。
2021-12-29
工作
个税
由于近期关于全年一次性奖金优惠税率的政策变动,引发了同事之间关于税收的大讨论。
简单的搜索了一下,没有找到很好用的个税计算器,关于年终奖的说明也不清晰。
故查阅了相关资料,自己做了下面的个税计算器。另附税率表以及关于奖金的常见问题。
希望对大家有所帮助。(如果需要对比,建议打开两个窗口)
年综合累计所得税率表
2021-12-21
Coding
IDEA
IDE
工具
IDEA是JetBrain公司推出的Java集成开发环境。
由于其强大而又易用,受到了许多开发者的青睐。
JetBrain公司随后又推出了PyCharm, GoLand, WebStorm等软件用于各种语言的开发。
事实上他们都是IDEA的定制版,他们的核心功能都和IDEA相同。
本文将介绍IDEA的各种使用技巧,他们适用于所有一系列的JetBrain产品。
我们要学习的第一个也是最重要的功能就是查找动作 (Find Action)。默认快捷键为CTRL+SHIFT+A。
2021-09-08
数学
趣谈
看到标题你或许会内心一惊,但是请放心,这里是正经博客,讨论的是一个数学问题
小便池问题是在我初中时期广为流传的一个问题(梗)。
在和H君和R君(当然,我早就和悦悦讲过🙂)两次提起这个问题之后,终于勾起了我重新解题的冲动。
距离上一次思考这个问题已经是十多年前了,彼时的我并没有得出通解,一觉过后也就未再深究。
今天希望我可以顺利解出。
男同胞可以选择跳过本节
一般男厕所由两部分组成,即小便池和单间。
其中小便池通常一字排开,条件好一点的还会有隔板隔开。
2021-08-18
Coding
StackOverflow
Typescript
原题链接
原问题很简单,如何在Typescript中定义一个联合特定范围数字的整型类型。
Accepted Answer给出的答案是:
No it's not possible. That kind of precise type constraint is not available in typescript (yet?)
Only runtime checks/assertions can achieve that :(
2021-06-19
Coding
Typescript
自2012年诞生至今已有10个年头,Typescript已然成为Javascript项目的标配。
Typescript的类型系统是笔者学过的几门语言中表现力最强的,同时也兼顾了可读性易用性。
本文将介绍Typescript的类型系统的各种(高级)用法,帮助你在需要时定义更贴合业务的强大类型。
关于基础知识,在这里不做赘述,如有需要请自行阅读官方文档。主要包括
我们可以通过type关键字来定义类型别名,这可以简化我们的类型注解,不需要在每一处写冗长的类型。
2021-05-10
Coding
PWA
Web
渐进式网页应用(简称PWA)是一种Web应用标准。
通过使用一系列新兴技术让你的Web应用快速,安全,可安装,可离线使用,可适配各种设备,使其拥有不亚于原生应用的使用体验。
主要技术包括App Manifest, Service Worker, Web Push等
PWA最早由Google于2015年发起,同年Chrome支持Service Worker。
之后,Safari和Edge也相继在2018年和2019年提供支持。
2021-05-08
Coding
Spark
屏障执行模式(Barrier Execution Mode)是Spark 2.4版本引入的新的执行模式。
旨在支持让Spark平台支持更多样化的工作类型,例如调度ML(机器学习)/DL(深度学习)训练任务。
本文将带你了解什么是屏障执行模式,为什么Spark需要,以及如何使用。
MapReduce是大多数流行框架的执行模式,通过划分Map和Reduce阶段(Stage),可以灵活的处理各种作业(Job)。
在MapReduce中