缓解 Flarum 图片加载时的布局偏移
现代的 Web 开发中,CLS(Cumulative Layout Shift)是一个关键的 性能指标,它主要关注用户在 Web 网页的使用中,发生意外布局偏移(Layout Shift)、影响用户体验的情况。导致 Layout Shift 的因素很多,这里主要讨论的是图片加载过程的影响。
现代的 Web 开发中,CLS(Cumulative Layout Shift)是一个关键的 性能指标,它主要关注用户在 Web 网页的使用中,发生意外布局偏移(Layout Shift)、影响用户体验的情况。导致 Layout Shift 的因素很多,这里主要讨论的是图片加载过程的影响。
COVID-19 是个沉重的话题,贯穿了过去的三年。回想我22年来的心境,大体是在一种平和状态,虽也伴着喜怒哀乐,但在挣扎中慢慢有了更多属于生活的节奏;情绪上受疫情影响占多数,对于一些灾难性的新闻,可能大脑处于自保的缘故,下意识有些想不起来了。尝试总结时回想起这个话题,篇幅逐渐无法控制,也许单独拿出来好点,生活逐渐恢复的当下,也试着留下一些记录。
网上冲浪时看到一个帖子,大体是一个腾讯校招研发同学工作第一年的总结,提到了一个自己未来 10 年的人生规划。大致说在 xx 年晋升到 T7,yy 年转型某技术领域,zz 年成为 T9 高级工程师,进一步成长为技术专家,xx 年拿到 xxK 以上的薪资,然后再过两年交上女友、结婚成家 balabala,大大小小安排得明明白白。
回想我迄今为止的职业生涯,最早我是意外得到的实习,也是在实习结束后顺其自然继续留下工作,一直以来靠着惯性做着「前端工程师」这一岗位,而鲜有对「工作」本身的思考,颇有一种“当局者迷”的即视感。
自从上大学以来,我一直有在关注学习理论、知识管理相关的方法与工具,先后用过 Typora、Anki、印象笔记、OneNote、MarginNote、TiddlyWiki 等等等等。其中也慢慢 从对某些具体工具的执念中走出,更关注一些设计哲学与方法层面的东西。大概 19 年的时候开始使用 Notion,后来开始实习、工作,逐步用起 Obsidian 至今。
近一年来在工作上面临着较大的变化,一方面因为不可抗力因素,一步步放下念想,离开腾讯,也离开了在线教育行业;另一方面,自身开始有了一些“价值”视角的感知,也以此重新思考自己在业界的定位,还有继续积累的方向。 如疫情催化下的互联网一般,一切都来得比预想中更迅捷和猛烈,虽有一些预期,但确实略有些措手不及。近期尘埃渐定,平静下来的时光,也写写最近关于找工与跳槽过程的一些想法和考虑吧。
最近把博客从 Typecho 搬到了 Next.js + Vercel 驱动、Notion 为 CMS 的架构(使用 nobelium 搭建),其中评论区转到了 cusdis 作为后端。原博客有文章 112 篇,评论总量大约 1.2k 条,文章迁移手动操作还行,但评论数据的迁移经历了一些小坎坷,断断续续花了两个周末才弄完,也写一写其中踩过的坑,还有一些小小的心得。
生活越来越忙碌,要面对的事越来越多,近期面临大环境影响下的工作变动,深感大块专注时间的宝贵,能花在博客本身折腾上的时间也越来越少;但仍希望能通过记录,看到一些脉络和体系,让自己对自我有更清晰的认知。也以此对 blog 做一个更新换代,让写博文的心智负担小一些。
劳动节的假期,把大学以来写的比较长的文字整理到了 Notion 的 Database,尝试从一个抽离的视角,观察我这几年来的所思所想。
自19年写过一次年终总结,20年经历着疫情、毕业和初入工作的迷茫,外加未能很好地处理自我空间与忙碌工作的关系,文章一直还是躺在笔记软件中的草稿状态。人不可能持续活在回忆中,暂且放下,或许未来某段 gap 时光会再写写。
说起散步,至今毕业一年有余的我,一年中常一个人在周末晚上从桃园骑车至桂庙新村,走到科苑再沿着大沙河走到深圳湾公园,再穿过白石洲城中村返程。近来在尝试新的路线,从南头古城到中山公园、从常兴路到学府路、南新路走到荔林公园再到南油,继续收获了不少深圳街头的风、还有那随风飘乱的思绪。
一个服务器上分别用单独的 docker-compose.yml 配置了两个单机网站项目 1. 网站项目(有 nginx、php-fpm、MySQL 等容器) 2. caddy 反向代理 现在希望 caddy 的容器可以反向代理到项目1里面的 nginx 上,这就涉及到了容器网络互通的问题。
回想最近独立负责开发的一个需求:App 中的一个子模块,客户端提供的 WebView 加载网页,实现的一个单页应用(SPA)。其中功能拆分到多个不同的子页面分别实现,各个子页面实质上只作为这一 WebView 页面中的一个模块,通过 React Router 去分发路由和渲染它们。
我们总在探索未知,但许多思想性的东西总是在过高的抽象出发,就像张一鸣说的“给思维加杠杆”,一不小心思绪飘得太远,就有点游离于当下生活的感觉。时间长了,慢慢地让人变成一个只会精致把玩各种抽象概念与黑话的混蛋。
近日师弟在社区提了关于实习的一些疑惑,看到前辈们的热心回复,感慨良多,也写了写关于实习的思考与想法,回复在了楼下。
偶然刷到这篇博文:我在字节跳动实习的三个月 | 无辄的栈 ,感慨良多。想来毕业开始搬砖至今也有三个月,好久未更新 blog,还是写写吧~ 兜兜转转,可以让自己慢下来思考的,还是博客的编辑器。
一直以来我对“标签”这玩意儿并不怎么感冒,但挂着公仔厂的工牌,无论是租房找室友、坐车、买东西等等,似乎总很快能给人带来某种天然的信任感;买东西的时候,常常倾向于选择某个品牌而懒得去挑。不得不承认的是,每一个人心力有限的背景下,标签降低了认识与建立信任的成本。
上篇文章 我们写了 Flarum 二次开发项目的规划,这里也分享一下本地开发与调试 Flarum 的配置的方案,助你快速搭起 Flarum 的本地开发调试环境。
上篇文 我们介绍了适用 Flarum 的 Docker LNMP 环境的配置,本文将进一步从本地环境搭建、版本控制的设计的角度,介绍一套可操作的 Flarum 项目配置与二次开发迭代方案。
Flarum 是一个简洁的轻论坛程序,交互体验做的十分不错,也有良好的插件扩展机制。接触过的人可能知道,它目前还在 beta,在功能更新和迭代方面不算稳定,部署、修改与定制功能更是一件麻烦的事情。 在 2018 年,我基于它构建了 0xFFFF 社区。经过两年的不断推翻与修改,慢慢沉淀下了一套适合持续迭代的 Flarum 部署与开发迭代方案。
B站在 5.3 那天出了一个 演讲视频 ,当时大概看了一遍,想到互联网正在改变很多现状,还是挺认同B站背后反映的互联网下 “认知盈余” 的现象。但这种表达形式让我感觉十分做作和尴尬,压根谈不上喜欢,也就没多留意细节。
上篇博文 引出了“硬币模型”,从“抛硬币”的角度描述了计算机数据的最本质属性。同时也介绍了为若干硬币赋予现实意义、实现更多数据在计算机表示的基本思路。 接下来我也会具体展开介绍一下数字、文字、音频、图像、视频在“硬币体系”下的表达,为你带来更直观的印象,本篇将重点介绍“数字”的表达。
最近与几个朋友聊到了“信息的本质”相关的话题,惊讶地发现,即使是计算机相关专业在读,面对“数据究竟是怎么一回事”这个问题,许多人依然云里雾里(包括我)。 解决了这个最根本的问题,方可从计算机领域的各种复杂之中解脱出来。所以我也尝试以文章的形式梳理一下。
过去在微博遇到许多带来思考与快乐的内容,但常常因为时间太久远,回看收藏链接往往返回的是404,记忆也随之变成了一个个空洞。脑洞打开,是不是可以把一条微博涉及到的各种文件一键打包下载,在本地阅读呢,就像 docx 文档格式一样。
过去没有写年终总结的习惯,但看到大伙儿的总结,回想自己整个人经历着大幅度的变革与刷新的一年,或许还是有必要在部落格里记录一下。时间串起的生活是一条线,但每一个当下与过去频频交织,组成了一个错综复杂的网络,想用线性的文字去描绘它,很多时候得到的是冗长和啰嗦。想想,面对网络,常常需要集中在几个点再出发,才好凝聚表达的力量。就像 "PowerPoint",内容有 Point,表达才有 Power 吧。
去年开始博主我大致确立了一个以 RSS 聚合为主,其它信源随缘查看的资讯订阅流程。其中一大需求是同步不同客户端的阅读记录,需要一个服务器端运行的订阅器。当时用的是 Tiny Tiny RSS 和它的 fever 插件,结合 tt-rss 安卓客户端和 Reeder 实现。
周六发现一个安静看书的好去处:科苑站附近的 Dots Coffee。这儿没有星巴克的喧嚣、没有挤满考研考证党后的图书馆的压抑、东西不贵,点杯茶可以坐一整天。一切都刚刚好。所以周日又来到了这里。两天来我都在整理手里的英文版龙书 PDF,这文档目录书签不完全,为了和 MarginNote 对上,得手动用 Acrobat 给它一个小节一个小节地加上,1000 多页的书,两天弄完,想来也当作对这本书的框架的一种熟悉吧。
这两年来接触了不少的笔记工具,尝试去建立自己的知识库和信息收集、整理、内化的体系。实习工作的忙碌,则带来了体系的一次又一次的 崩溃-->重建-->崩溃... 的过程,让我对这方面有了更多的思考。用过各种各样的工具,到最后都是一个“是否顺手”的问题,关键点在于能否跑起一个高效又稳定的流程。
再一次冒出许多想法,想着发条朋友圈,不知不觉写了很长,一看时间,也已过去很久,想到这一大段文字最终的宿命不过是一瞬的滑过,只好让它继续留在了笔记之中,才意识到自己还有这么一个更适合写东西的地方。
无意中发现和尝试了 Chrome DevTools 的 Layers 面板,Get 到了庖丁解牛的新视角。不禁感叹 Web 浏览器的巧夺天工,也从此打开了浏览器从 Layout->Paint->Composite 中的 Composite 过程的研究的大门。
© zgq354 2014 - 2023 | CC BY-NC-SA 4.0 | RSS