企业官网建设流程全解析

帝国做的网站怎么上传,百度地图优化排名方法,wordpress类似头条主题,asp网站镜像代码FreeTool 网站自上线以来#xff0c;总用户数已突破4k#xff0c;平均每日有超过200人访问。FreeTool是一个集各项实用功能于一体的工具站#xff0c;除前文提到的一些功能外#xff0c;目前增加了一系列新功能#xff0c;并对网站的访问速度进行了一系列优化。 FreeTool访…FreeTool 网站自上线以来总用户数已突破4k平均每日有超过200人访问。FreeTool是一个集各项实用功能于一体的工具站除前文提到的一些功能外目前增加了一系列新功能并对网站的访问速度进行了一系列优化。FreeTool访问地址https://xdxsb.top/FreeTool新功能xml格式化xml格式化支持将一段未格式化的xml文本进行树状视图展开。模板快速拼接模板快速拼接支持将多张图片快速拼接成一张图适合双图对比、多图展示等场景。其中图片的顺序可以用鼠标拖拽调整。视频比例转换视频比例转换支持自动将视频变成不同比例比如将横屏视频改成竖屏制式背景可以选择用纯色或模糊填充。文本差异对比文本差异对比可以将两段不同的文本进行对比查看高亮不一致的内容行。同时支持word/txt文件内容导入。PDF转PPTPDF转PPT是指将PDF文件转换成PPT的格式。适合把NoteBookLM/秘塔AI等平台生成的PDF格式的幻灯片处理成PPT。提示词生成器提示词生成器针对AI绘画/视频/写作/PPT四个场景配置了一些即点即用的模板这些形容词往往是一些“开关”添加前后可能会让生成内容产生质变。网站加速在之前的文章中有人反馈网站进不去加载慢。最有效的方式就是针对国内访问环境增加CDN缓存即将网站内容提前缓存到全国各地的CDN服务器上用户访问时从最近的服务器上去获取内容这样就非常快。但看了一圈国内的CDN服务都不算便宜并且对域名有备案要求我这个域名在服务器过期之后备案已经失效了。因此只能从其它方式角度考虑尽可能增加网站加载性能。CDN依赖优化网站中观察网络请求就能发现有些依赖是通过国外的免费CDN进行加载。于是让AI帮我替换成了一些在国内访问速度更快的CDN。原CDN新CDN资源fonts.googleapis.comfonts.googleapis.cnGoogle Fonts (Inter 字体和 Material Icons)cdnjs.cloudflare.comcdn.bootcdn.netHighlight.js (代码高亮)cdn.jsdelivr.netcdn.bootcdn.netKaTeX (数学公式渲染)cdn.jsdelivr.netcdn.staticfile.orggif.js (GIF压缩)unpkg.comcdn.staticfile.orgTailwind CSScode.datagridxl.comcdn.jsdelivr.netDataGridXL (表格编辑器)依赖自托管虽然换了CDN但还是发现这几个依赖datagridxl2(表格转换)、katex(公式渲染)、highlight(代码高亮)、gif(gif压缩)占用了很多加载时间至少拖慢了3秒钟。于是索性采用自托管的方式直接加载不走网络请求这样能明显提速。使用字体预加载浏览器默认不会立即加载字体而是等到 CSS、DOM 都加载了并且发现某个元素需要该字体时才开始请求。用户侧的体验就是界面已经渲染完了字体突然又刷新了一下。字体预加载就是在浏览器解析 CSS 之前字体文件已在下载字体文件会提早进入 HTTP 缓存从而提升速度。Tailwind CSS 优化原本通过 CDN 去加载 Tailwind这样必须下载全量 Tailwind400KB包含所有颜色、间距、阴影、响应式类动态生成 CSS并且没法缓存每次刷新页面都要重新编译。于是借助 PostCSS本地构建CSS只生成网站里实际用到的样式体积从大幅下降并且该 CSS 是静态的可缓存首次加载后瞬间打开。异步动态加载脚本网站中用到不少第三方依赖虽然采用了子托管的方式去降低网络请求延迟但基本逻辑还是首次访问页面就直接加载完成。异步动态加载是指只在需要的时候去加载即切换到对应的功能Tab界面此时相关脚本才开始加载。这样又能减少网站初始加载的内容提升速度。图片格式优化WebP 是 Google 推出的图片格式占用空间会比 png/jpg 小很多。对比PNGJPGWebP体积中等小更小清晰度高中同样清晰但更小支持透明✔️❌✔️于是把图片用 cwebp 转换了一下体积有超50%的减小。字体格式优化WOFF2 是 Google 推出的字体格式和图片格式类似它会比TTF格式体积小很多。用 woff2_compress 把 ttf 转成 woff2体积减少到1/3。React组件懒加载React组件懒加载指的是按需加载 React 组件代码和前面“异步动态加载脚本”有点类似主要区别是它是作用于组件而不是外部依赖这样也能提升页面加载速度。最终效果对比经过一系列优化措施后网速提升的效果还是比较明显的。优化前优化后当然对于上不去github的用户来说不管怎么优化还是会访问不了。如果有云服务厂商来找我合作提供免费的服务器资源我会很乐意在网站的角落中公示赞助商的信息。