php 双问号可以链式使用 刚才改网站代码,偶然发现 php 双问号是可以链式使用的: $ret = $a ?? $b ?? $c ?? 4; 原本我是应该加括号的: $ret = $a ?? ($b ?? ($c ?? 4)); 无心之失忘了加括号,竟然可以执行,才发现双问号可以链式使用。 之所以有这样的乌龙,是因为我这个从 php5 时代入行的古典程序员,对新的语法糖是想当然的,没有去仔细看过文档。双问号的使用习惯也是从三元式演变过来的,自然没想过还能链式使用。 用三元式表达上面的语句是这样的: $ret = isset($a) ? $a : (isset($b) ? $b : (isset($c) ? $c... 2022-11-11
CleanCSS - 移除未使用的 CSS 代码 应用:CleanCSS 地址:https://dujun.eu.org/cleancss 功能:分析页面中引用的 CSS 文件,打包成单一的干净文件用于替换所有引用 适用:独立页面 一、缘起 我导航站用了开源项目WebStackPage,首次静态资源加载有 1.5M,一部分原因是它使用了第三方库,比如 Bootstrap。当然,第三方库只有少量代码实际被用到,所以我就想找个办法,把未使用的 CSS 代码移除,使得静态文件更小。 二、方案 很快就找到了这个网站https://unused-css.com/。它可以很好地实现我的需求,不过有一个小问题,它是收费的,最低 25 美元一个月。 Only... 2022-10-31
JavaScript 强混淆 我的网站是纯内存缓存读 + js 渲染 spa,现在的瓶颈就是硬件配置低、带宽小,程序架构上可以说追求到极致了。其中,js 渲染是全站性能优化的关键一坏,服务器只负责吐出原始数据,而把路由解析、数据处理、布局渲染的计算压力都转嫁给了浏览器。 如此重要的前端部分我当然花了很大的心思。js 是明文的,只能做混淆。但是如果混淆得足够好,逆向成本过高,也是可以达到很好的代码保护。网上有很多 js 代码混淆的方法可以参考,但有些会让文件大小增加好几倍。这里我分享一下自己 js 强混淆的思路。 我实现 js 强混淆的关键一点就是字面量表达式。 原生写法: str.trim(); 字面量表达式... 2022-10-19
互访功能页性能优化探索 我的主力电脑是 4 核 i7 16G MacBook Pro,所以我用互访功能页开几十个页面是没压力的。收到有些博友反馈打开页面太多电脑卡死,我并不能理解。直到昨晚,我找出 2 核 i3 4G 的笔记本跑了一下,果然卡。因此有必要对互访的性能做进一步优化了。 理想的逻辑是,一次只打开 5 个页面,其他在队列中等待,每加载完一个网站,关闭当前页,打开队列中另一个网站。这样浏览器同时最多只会存在 5 个页面占用。但尝试了一下,这个方案目前无法实现,因为跨域问题。 一、窗口对象 直接用 window.open 对象,无法监听加载状态, onload 会发生跨域错误。 二、iframe 嵌入... 2022-10-19
友情链接模块发布 新增友情链接页面,入口在电脑端的侧边栏或手机端的搜索页的“友链”。 1. 前言 建站七年了,一直没有做友情链接的模块。诚然,博客这种古典互联网产品,友链是最典型的应用,缺失有点遗憾。期间也反复想过要做,但是有两方面问题没有找到满意的方案。 1.1 没有满意的友链样式 网上常见的友链有这些样式: 网站名称文字链接 头像加网址、网站描述 网站链接加最新 feed 头像、网站描述都是静态的,我觉得无趣。于是我尝试过抓取 feed,然后就有两个问题: rss 地址发现,需要匹配各种未知规则,除非手动填写地址; 有些网站没有 rss,如果直接爬取页面,匹配内容又很麻烦。 所有长期以来... 2022-10-06
同步ajax导致页面卡顿 我的网站在快速切换页面时,有时会卡顿甚至假死。之前我以为是带宽太小的缘故(1Mbps),直到在 MDN 查找 XMLHttpRequest 相关资料时看到这个说明: XMLHttpRequest supports both synchronous and asynchronous communications. In general, however, asynchronous requests should be preferred to synchronous requests for performance reasons. XMLHttpRequest 支持同步和异步通信。但是... 2022-09-18
鼠标气泡 宝宝日记的页面中规中矩,一直想加点活泼的元素,苦于没有找到理想的参考样式。 前天,在博友Design小院那里看到了鼠标气泡的效果,感觉很喜欢。寻迹找到了控件原作者的网站90's Cursor Effects。动效如下: 在源代码基础上主要做了两处修改: 增加气泡随机透明度,更显真实; 原配色在暗黑模式下过于显眼,改为牡丹粉红 #eea2a4。 完成的动效如下: 已实装于宝宝日记时间轴、宝宝日记详情页。 2022-08-24
波浪下划线 本站对文字的重点标记,经过了几次改版。 一、着重号 最初使用着重号。它的问题是会造成段落间距变大,同时大圆点标记过于醒目,抢夺阅读视线。 text-emphasis: filled circle; text-emphasis-position: under; 效果如:对照文字、着重号标记的文字 二、虚线下划线 着重号用了没多久,就改成虚线下划线了。 border-bottom: 2px dotted; 效果如:对照文字、虚线下划线标记的文字 三、波浪下划线 虚线下划线没什么问题,但是今天突然觉得平庸了,决定改成波浪线。 代码参考了 CSS实现文字下面波浪线动画效果。具体实现如下... 2022-08-02
H264需为偶数尺寸 刚才上传一个 mp4 视频时报错(视频见上一篇文章),本地调试发现错误信息为: [libx264 @ 0x55a5429f40c0] height not divisible by 2 (540x771) 搜索相关信息了解到:旧式 H264 编码视频(如 yuv420p 格式)如果长宽中含有奇数会导致转码失败。 因此,强制转换长宽为偶数: $width = 2 * (int)ceil($width / 2); $height = 2 * (int)ceil($height / 2); 之前一直没发现这个问题,大概是因为绝大部分是手机直接拍的视频,都是标准偶数尺寸。 2022-07-22