2020-09-25周五
Vue 3 正式发布,再度踩坑

Vue 3 终于在 2020.9.18 发布了第一个正式版「One Piece」,到现在已经一周了。终于有时间来体验一把正式版的 Vue 3 是什么样子了。 准备 初始化项目 这次,我不再使用 vite 来建立项目,而使用 vue-cli。 vue create vue3-blog cd vue3-blog vue add typescript yarn add vue-router@next yarn add vuex@next yarn serve 注意在选择 vue 版本的时候选..

2020-09-10周四
每天一个劝退小技巧之位操作

为什么要使用位操作,因为位操作是直接操作二进制数,是所有语言中执行效率最高的运算。 以下代码以 JS 为例,部分代码在所有支持位操作的语言通用。 快速取整: parseInt(2.2) === 2.2 // true parseInt('1.3') === '1.3' // true 1<<30 === 1<<30 // true // notice parseInt('4294967296') === 4294967296 //false, 越界 parseInt('42949672..

2020-09-08周二
极简可爱的博客生成器

简介 Candy 是一个基于 Kami 前端精简后的博客生成器. 它是一个纯静态的博客, 类似于 Hexo, hugo, 但是它并不支持更换主题. 它的风格只有一款. 它是基于 NextJS 的优越性, 仅花了一天时间精简移植的产物 功能上, 他只有最基本的写作功能, 甚至连评论都没有加入 要问为什么? ||反正我又不用|| 为什么会选择它? 大概只有一个原因, 只是为了可爱. Candy Live Demo 预览 ..

2020-09-06周日
文字溢出边缘羽化 CSS Mask 实现

在很多时候都需要处理文字的溢出,尤其是对单行网格处理时,需要避免文字过长导致容器撑坏的情况。一般会固定文字最大宽度和 overflow: hidden; text-overflow: ellipsis 让溢出的文字显示成 ...。但是现在可以用 CSS 的 mark 属性,让溢出的文字边缘羽化。 如图 Chrome 的 tab。 ¡边缘羽化 首先看看 mark-image 的兼容性。 基本上都支持,需要注意的是我使用的 Chrome 85,还在试验性阶段,需要加上前缀 -webkit- ..

2020-09-01周二
八月更新小记

这是一个平平无奇的更新日志。 前端 重写了 Input 组件 修复了 Project 页面的栅格错位 其他优化 后端 增加了评论屏蔽关键词 (乱七八糟的内容会被吃掉哦 增加了文章的 Tag 增加了自动 Push Sitemap 到百度搜索联盟 (然并卵 修复了自动无法删除日志的 Bug..

2020-08-21周五
编写更加简洁易阅读的代码

好的代码,往往不是又臭又长,而是小而精悍。用更少的代码,实现相同的功能。不管是自己还是同事日后阅读,都不会感到困惑。 在这里,记录前端开发中,优化代码的几种方式。 噩梦地狱嵌套 大概大家都看过怎么一张图 RkwiBh 在遇到这个写法的时候, 首先要想一想这样到底有没有用,有没有办法优化。像图中的根本就没有必要去嵌套。 再来看个例子。 const payload: | undefined = { page: '1', size: 10 } // payload from s..

2020-08-15周六
不同寻常的地址栏过渡

前几天,我在推特上看到这样一张图。 ezgif-6-2b27134bbba1 原来地址栏还能这么玩,瞬间就觉得自己弱爆了。然后我决定去实现一下这个效果,然后做成一个库。 花了一个晚上,终于做好了。这是最后的成果。 2020-08-1519.20.53 这个库使用非常的简单。 你只需要, yarn add animate-uri 然后 import { animateUriFactory, bindAllLink } from 'animate-uri' animateUriF..

2020-07-27周一
七月更新小记

暑假终于开始啦(其实已经过了好久了),相比在学校里忙忙碌碌的日子,在家每天懒懒散散,没有什么干劲可言。即便是这样,每天还是得花时间写写代码呀,当然学习一门新的语言,开辟一个新的领域也还是要跟上的。 话不多说了,总结一下七月我做了哪些改进吧。 前端 改进了图片预览组件 引入了 Sentry 异常追踪 加入了友链申请框 优化了某些过渡动画 减少了对 antd 的组件的依赖(争取把剩下的四五个组件自己重写) 重写了错误信息解析组件 暂时取消了渲染服务器的缓存机制(由于前后端不在一台服务器导致的间..

2020-07-14周二
Electron 的打包与构建

说起 Electron,大家能定不会感觉到陌生,庞大的体积,内置浏览器,Hello World 都有 200+M... 我个人是很反感跨段应用的,虽然对于开发来说,节省了很多时间,但是站在用户的角度来讲,体验就不是那么称心如意了。但是最近一些业务需要用到 Electron,折腾过程中也踩了不少坑,总结一下。 开发环境的搭建 平时我们在开发前端应用时,一般都是使用 Webpack 去打包,在开发环境中,也是由 Webpack dev server 来实现 HMR。在 Electron 中也是可..

2020-06-30周二
聊聊科技界发生的大事 WWDC

最近科技界发生的大事莫非就是上周的 WWDC 了,很抱歉因为很多事情直到现在才来总结和谈谈看法。今年的 WWDC 也不同于往年,而是在线直播。虽然说是直播,但是当我等到晚上 1 点的时候才知道原来是录播,还是有点小失望的。虽然是录播不得不说剪辑是非常完美的,任何过场都是无缝衔接。伴随着过场甚至带着我们参观了一遍 Apple Park。 !开场的星星其实是开发者啦,上面有你吗 iOS 简单的问候之后,便开始介绍大头 iOS 14。首先最大的一个 feature 就是 Widget,这也是很久..