• 2024-06-20记录--单页面首屏优化,打包后大小减少64M,加载速度快了13.6秒
     
  • 2024-06-13项目性能优化方案
    前端性能优化的指标首屏速度,白屏时间等操作速度以及渲染速度等  首屏速度白屏时间渲染页面资源加载首屏js执行首屏数据请求Dom渲染首屏速度可以做的操作#收效很大的操作1.减少首屏资源体积(打包工具的压缩,异步加载,更新为体积更小的新版本,编写代码
  • 2024-05-28vue首屏加载动画打包后失效
    本地环境运行时,没有问题,打包后,加载动画没有效果,尝试修改:extract:false后成功。 加载动画示例:index.html中<linkrel="stylesheet"href="static/css/loading.css"/><body><divid="app"><divid="appLoading"><d
  • 2024-05-26前端性能优化总结
    1.图片懒加载原理  图片懒加载也叫延迟加载,只加载当前屏幕的图片,可视区域外的图片不会进行加载,只有当屏幕滚动的时候才加载。特点:提高网页加载速度减少后台服务器压力提升用户体验原理:将图片地址存储到data-xxx属性上判断图片是否在可视区域如果在,就设置图片src绑定
  • 2024-04-22实战剖析-vue项目首屏加载时长优化
     首屏速度是用户体验的最关键一环,而首屏速度最大的决定性因素就是资源的加载速度,资源加载速度等于资源大小+网速,老的前端项目随着不断增长,代码可能会变得混乱,冗余难以理解,不断的做加法,久而久之,前端性能上就会受到影响,相信大家在工作当中一定遇到,页面加载时间慢,响应时间长等
  • 2024-02-06亿级流量高并发春晚互动前端技术揭秘
    前言2022年1月,京东成为央视总台2022年春节联欢晚会独家互动合作伙伴,双方在红包互动、电商等方面展开全方位深度合作。在除夕当天产生691亿次互动,送出15亿元红包好物。如何在这种大规模、高并发的场景下,确保系统的稳定性和性能,为用户提供稳定流畅的互动体验,成为了我们亟待解决的
  • 2024-01-20直播app系统源码,通过延迟加载非关键资源实现首屏优化
    直播app系统源码,通过延迟加载非关键资源实现首屏优化将非关键资源(如广告、推荐内容等)的加载延迟到首屏渲染完成之后,以提高首屏展示速度。<!DOCTYPEhtml><html><head><title>延迟加载示例</title></head><body><h1>首屏内容</h1><!--非关键资源--><d
  • 2024-01-02什么是流媒体
    所谓的流媒体是指将一连串的媒体数据压缩后,经过网络分段发送数据,在网上即时传输音视频以供观赏的一种技术。如果没有流媒体技术,那么在观赏前必须下载整个媒体文件。常见流媒体协议:RTSPRTPHTTPHLSRTMPHTTP-FLV等目前应用流媒体技术就多的场景就是直播场景。完整的直播系统包括以下这
  • 2023-11-11office ppt word excel 冷启动去首屏加载动画
    有没有人知道这么解决冷启动慢的问题吗,装完重启后打开都要好几秒匿名2023-5-2718:56:59回复GoogleChrome102.0.0.0GoogleChrome102.0.0.0Windows10x64EditionWindows10x64Edition找到方法了。改注册表计算机\HKEY_CLASSES_ROOT\Excel.Sheet.12\shell\Open\comm
  • 2023-11-02uniapp 打包缺陷
    uniapp打包时候会把所有用到的公共组件和公共封装打包到一起,在首页直接加载,这样会严重影响首屏的显示速度目前没有找到好的最小化分离首屏依赖的打包方式考虑可行的方案1.写一个webpack插件,通过分析指定模块的依赖,将模块和模块依赖分别打包2.深入webpack配置,看
  • 2023-10-23首屏图片展示
     找到一个首页过度动画:<template><divref="centerBg"class="centerBg"><!--mask--><divv-if="len"class="mask"><divclass="grid":style="{gridTemplateColumns:
  • 2023-07-17性能优化前瞻
    概述开发时构建速度优化首屏渲染优化js逻辑优化css优化生产构建优化开发时构建速度优化首屏渲染优化js逻辑优化css优化避免过度嵌套关注继承属性,可以继承,不要重复写生产优化
  • 2023-06-14海外弱网下的在线视频平台优化实践​
    正文字数:10745 阅读时长:16分钟在弱网下,视频启动时间和播放卡顿都会增加。为提升弱网用户体验,需要识别出主要问题再针对性调优。本演讲将结合四达时代在非洲建设”StarTimesOn在线视频平台“过程中积累的丰富数据,分享传输路由优化和传输协议优化相关的关键问题,以及各类针对性调优
  • 2023-06-052021-08-12--Web前端性能指标和性能优化(综述)
    title:网站的几个性能指标和优化(简易)categories:-网络安全与性能优化tags:-性能优化-性能指标-白屏时间-首屏时间-TTFBabbrlink:5c56date:2021-08-1223:42:49updated:2021-08-1223:42:49来源:https://m.sohu.com/a/201865334_509523/关于
  • 2023-04-18影响页面首屏加载时间的因素
    项目增加后,首屏加载就会出现白屏的问题,一般首屏加载时间最好在2秒以内,才能不影响使用体验下面介绍下主要影响因素和解决办法:一、网络问题:1)可能是由于网络厂商和服务器性能决定2)请求太多,由于浏览器并行请求在8个以下,超出的只能排队等待,所以如果请求太多,不仅增加了网络T
  • 2023-04-13好奇心驱使下试验了 chatGPT 的 js 代码的能力
    手边的项目中有个函数,主要实现图片分片裁剪功能。可以优化一下。也想看看chatGPT的代码理解能力,优化能力,实现能力,用例能力。于是有了这篇文章。实验结果总结:chatGPT确实强大,提供的答案可以借鉴,但不能完全依赖,需要你自行判断是否正确当你需要一个纯函数时,可以考虑使用。
  • 2023-04-10关于vue2老项目的打包优化,实现首屏加载速度提升
    分析项目代码体积yarnaddwebpack-bundle-analyzer在webpack.dev.conf.js中配置constBundleAnalyzerPlugin=require('webpack-bundle-analyzer').BundleAnalyzerPluginplugins:[newBundleAnalyzerPlugin(),//代码体积分析插件......]执行yarnrundev或
  • 2023-03-28记录优化vue项目首屏加载慢的过程
    一背景当项目部署在外网时,前端首屏加载的平均时间是10S,通过开发者工具查看加载的包,例如chunk-libs.xxx.js的有2.9MB,因为包太大导致加载慢,严重影响了用户体验。所以解决
  • 2023-03-26关于 Web 应用的 Above-the-Fold Loading 加载机制
    Above-the-FoldLoading是一种网页加载技术,可以让网页的上半部分尽快地显示在屏幕上,让用户能够更快地看到网页的内容,提高用户体验。具体来说,Above-the-FoldLoading会优
  • 2023-03-25关于 Web 应用的 Above-the-Fold Loading 加载机制
    Above-the-FoldLoading是一种网页加载技术,可以让网页的上半部分尽快地显示在屏幕上,让用户能够更快地看到网页的内容,提高用户体验。具体来说,Above-the-FoldLoading会优先
  • 2023-01-04react 快速接入 sentry,性能监控与错误上报踩坑日记
    壹❀引本文是我入职第一个月所写,在主导基建组的这段时间也难免会与错误监控和性能监控打交道,因为公司主要考虑接入sentry,所以对于接入sentry的基建任务也提了一些需求,
  • 2022-12-17怎么解决SPA首屏加载速度慢?
    首屏加载首屏时间(FirstContentfulPaint),指的是浏览器从响应用户输入网址地址,到首屏内容渲染完成的时间,此时整个网页不一定要全部渲染完成,但需要展示当前视窗需要的内容首
  • 2022-11-03Vite和Webpack 优缺点对比
     devserver冷启动vite 数秒之内即可完成启动Webpack动辄十几秒甚至几十秒热更新Vite在热更新方面也是碾压Webpack由于Vite采用unbundle机
  • 2022-10-06vue路由懒加载(延迟加载)的写法..
    路由懒加载可以帮我们在进入首屏时不用加载过度的资源,从而减少首屏加载速度。(1)路由文件中,非懒加载写法:importIndexfrom'@/page/index/index';exportdefaultnew
  • 2022-09-30如何处理 SSR 服务端渲染时候,后端接口数据返回慢导致首屏白屏问题 All In One
    如何处理SSR服务端渲染时候,后端接口数据返回慢导致首屏白屏问题AllInOneSSR服务端渲染,后端接口慢,如何处理refs©xgqfrms2012-2020www.cnblogs.com/xgqfrms