Menu

洃少发表的所有文章

WordPress主题Doubt重构-END主题开发前奏

码农备忘录当前使用的主题是Doubt,是我做的第八款主题,这款主题是在Way主题的基础上修改而来的。Doubt参考了很多国内优秀的极简主题,在主题介绍中将会感谢它们。主题设计时候已是作者进入社会打拼的第七年(2022.2)。当时也处在人生转折期。之所以取名为Doubt,是因为这些年来走了很多弯路,又到了岔路口,我第一次...

WordPress主题END开发技术选型思路

在尝试Lit和Svelte框架之后,我更倾向于Svelte,其语法更友好。可使用Vite 进行初始化Svelte脚手架。 但测试之后,Svelte并不兼容IE11,但使用@vitejs/plugin-legacy 之后尝试可以兼容(暂时)。 由于此主题页面中,为突出文字内容及不改变原有SEO收录路径,所有有效内容(包括文章列表、文章内容、菜单、部分锚文本)还...

WordPress主题筹备,是结束也是开始(END主题)

醉风云博客十一周年了。 FengYun主题也即将完成它的使命。 深思熟虑之后,我决定,花费很长一段时间,为醉风云博客创作一款新的主题。 她将变得更加简单。她将更加突出文字。 终有一天,大象将重归原野。 … 原先是考虑使用Vue+Pjax架构打造一款极致主题的(很多博主这样搭配),但考虑到在这里只能用到Vue的模板引...

img元素srcset属性含义及作用

HTML img元素中有一个很少用的 srcset 属性,用于浏览器根据宽、高和像素密度来加载相应的图片资源。 属性格式:图片地址 宽度描述w 像素密度描述x,多个资源之间用逗号分隔。例如: <img src="small.jpg " srcset="big.jpg 1440w, middle.jpg 800w, small.jpg 1x" /> 上面的例子表示浏览器宽度达到 800px 则加载 ...

Vue/2/3重点总结—理论篇

一、Vue哪里好? 我认为一个好的框架首先有以下几点必要的特点 简单易学,文档完善,Api清晰易懂,容易上手 不会给程序员的开发过程带来很大的心智负担 社区完善,长期维护,有完整的生态系统 对业务逻辑及数据的关注度优先于框架本身的使用 低学习成本和使用成本 我认为,前端的发展思路永远是:在保证性能的基础上,...

前端常用性能优化方案

一切性能优化是根据网站测试结果去针对性进行的,不需要无脑的进行优化。另外,没有固定的优化策略,不同的项目要分而治之。 性能优化思路 了解浏览器工作原理及web渲染原理,认识影响性能的因素 使用如Performance、Lighthouse、PageInsight等工具对性能进行评估,帮助了解短板,说服Linder 使用控制台面板功能(如请...

前端缓存之Service Worker

什么是Service Worker Service worker是一个注册在指定源和路径下的事件驱动worker。它采用JavaScript控制关联的页面或者网站,拦截并修改访问和资源请求,细粒度地缓存资源。Service Worker 可以使你的应用先访问本地缓存资源,包括js、css、png、json等多种静态资源。 Service Worker的特点 独立于主JavaScript线程(...

优化资源阻塞Preload、Prefetch和Preconnect

本文介绍了前端开发如何优化资源的加载,减少资源往返时间。 Preload Preload 是一个新的控制特定资源如何被加载的新的 Web 标准,这是已经在 2016 年 1 月废弃的 subresource prefetch 的升级版。这个指令可以在 <link> 中使用,比如 <link rel="preload">。一般来说,最好使用 preload 来加载你最重要的资...

前端常见性能指标

文档流加载生命周期 DOMContentLoaded 是指页面元素加载完毕,但是一些资源比如图片还无法看到,但是这个时候页面是可以正常交互的,比如滚动,输入字符等。 jQuery 中经常使用的 $(document).ready() 其实监听的就是 DOMContentLoaded 事件。 load 是指页面上所有的资源(图片,音频,视频等)加载完成。jQuery 中 $(do...

关于前端监控方案

当有人问起:你们的公司的这款应用用户体验怎么样呀?访问量怎么样?此时,你该怎么回答呢?你会回答:UV(独立访客数,以cookie或token为依据)、PV(访问量,页面浏览次数) ,IP(独立IP数)等页面流量指标。 秒开率、RTT(延迟,数据往返时间)、TTI(页面可交互时间,用户与页面进行互动之前所花费的时间) 、FCP(...