当前位置: 首页 > news >正文

前端页面性能

提升页面性能的方法

  1. 资源压缩合并,减少HTTP请求
  1. 非核心代码异步加载

异步加载方式?

1)动态脚本加载、2)defer、3)async(在加载js的时候在script标签上添加这两个属性,<script src="./test.js" charset="utf-8" defer></script>)

异步加载区别?

defer: HTML解析完成后执行,如果是多个,按照加载的顺序依次执行。

async:加载完成后立即执行,,若是多个,执行顺序和加载顺序无关,那个文件加载完,哪个先执行。

  1. 利用浏览器缓存

缓存分类?

  • 强缓存:不问服务器是否能用这个文件,直接使用缓存的文件。以服务器后下发的时间为准。

Expires Expires:Thu,21 Jan 2017 23:39:02 GMT (绝对时间)

Cache-Control Cache-Control:max-age=3600(相对时间)

  • 协商缓存

Last-Modified If-Modified-Since

Etag If-None-Match

  1. 使用CDN

  1. 预解析DNS

<meta http-equiv="x-dns-prefetch-control" content="on"/>

//大部分浏览器是https协议的地址默认关闭a标签链接dns解析的,这一句可以强制打开a标签的dns解析

<link rel="dns-prefetch" href="//host_name_to_prefetch.com">//dns预解析,不加这一句也会自动预解析

相关文章:

前端页面性能

提升页面性能的方法资源压缩合并&#xff0c;减少HTTP请求非核心代码异步加载异步加载方式&#xff1f;1)动态脚本加载、2)defer、3)async&#xff08;在加载js的时候在script标签上添加这两个属性,<script src"./test.js" charset"utf-8" defer><…...

2023-03-04 反思

摘要: 当前的时期确实比较特殊&#xff0c;不但是对于一个生命周期的最后的挣扎&#xff0c;更是在经历了各种浮浮沉沉的波澜之后还有更多的波浪。 精神分析-GRY: 非常奇怪的一个跳梁小丑, 不过我个人认为用这个标签是对跳梁小丑的侮辱和上层管理者对于这种人的纵容有很大关系…...

奇思妙想:超链接唤起本地应用

文章目录分析实现参考很多人的博客都有这样的小玩意&#xff0c;点击之后就可以直接与博主进行对话&#xff0c;而且无需添加好友。 先研究一下网页源代码&#xff1a; <a href"tencent://message/?uin88888888&Siteqq&Menuyes">联系我</a>很明…...

初识数据结构——“数据结构与算法”

各位CSDN的uu们你们好呀&#xff0c;今天小雅兰进入一个全新的内容的学习&#xff0c;就是算法和数据结构啦&#xff0c;话不多说&#xff0c;让我们进入数据结构的世界吧 什么是数据结构&#xff1f; 什么是算法&#xff1f; 数据结构和算法的重要性 如何学好数据结构和算…...

华为OD机试Golang解题 - 计算网络信号

华为Od必看系列 华为OD机试 全流程解析+经验分享,题型分享,防作弊指南)华为od机试,独家整理 已参加机试人员的实战技巧华为od 2023 | 什么是华为od,od 薪资待遇,od机试题清单华为OD机试真题大全,用 Python 解华为机试题 | 机试宝典文章目录 华为Od必看系列使用说明本期题目…...

ESP32编译及运行错误记录

1、打印格式不对 一般都是因为日志中某个参数打印格式不匹配造成。 ESP_LOGI(TAG, "[APP] Free memory: %lu bytes", esp_get_free_heap_size());//将之前的%d 改为%lu 2、配置载不对 这里选择了蓝牙模块需要引入蓝牙组件才能编译通过 idf.py menuconfig Component…...

GEE开发之降雨(CHIRPS)数据获取和分析

GEE开发之降雨CHIRPS数据获取和分析1.数据介绍2.初识CHIRPS2.1 代码一2.2 代码二3.逐日数据分析和获取4.逐月数据分析和获取4.1 代码一4.2 代码二(简洁)5.逐年数据分析和获取5.1 代码一5.2 代码二(简洁)前言&#xff1a;主要获取和分析UCSB-CHG/CHIRPS/DAILY的日数据、月数据和…...

TypeScript中面向对象

面向对象 要想面向对象&#xff0c;操作对象&#xff0c;首先便要拥有对象&#xff1b; 要创建对象&#xff0c;必须要先定义类&#xff0c;所谓的类可以理解为对象的模型&#xff1b; 程序中可以根据类创建指定类型的对象&#xff1b; 举例来说&#xff1a; 可以通过Perso…...

Transformer 模型:入门详解(1)

动动发财的小手&#xff0c;点个赞吧&#xff01; 简介 众所周知&#xff0c;transformer 架构是自然语言处理 (NLP) 领域的一项突破。它克服了 seq-to-seq 模型&#xff08;如 RNN 等&#xff09;无法捕获文本中的长期依赖性的局限性。事实证明&#xff0c;transformer 架构是…...

深入理解js中的new关键字

在js中我们经常会使用到new关键字&#xff0c;那我们在使用new关键字的时候&#xff0c;new到底做了什么呢&#xff1f;今天我们就来深入探究一下 1.初步使用 我们先来使用一下&#xff0c;这是一个正常操作 function Person() {this.name "John";}let person new…...

RT-Thread Nano(2) - 线程

参考:RT-Thread API参考手册: 线程管理 线程的分类:动态线程,静态线程 动态线程是系统自动从动态内存堆上分配栈空间的线程句柄(程序运行时再分配空间),静态线程是由用户分配栈空间与线程句柄(可以说是程序编译时已经分配好空间) 1.创建线程 创建一个动态线程 rt_thread_t …...

真香,Grafana开源Loki日志系统取代ELK?

一、Loki是什么&#xff1f; Loki是由Grafana Labs开源的一个水平可扩展、高可用性&#xff0c;多租户的日志聚合系统的日志聚合系统。它的设计初衷是为了解决在大规模分布式系统中&#xff0c;处理海量日志的问题。Loki采用了分布式的架构&#xff0c;并且与Prometheus、Graf…...

机器学习|多变量线性回归 | 吴恩达学习笔记

前文回顾&#xff1a;机器学习 | 线性回归&#xff08;单变量&#xff09; 目录 &#x1f4da;多维特征 &#x1f4da;多变量梯度下降 &#x1f4da;梯度下降法实践 &#x1f407;特征缩放 &#x1f407;学习率 &#x1f4da;特征和多项式回归 &#x1f4da;正规方程 &…...

高并发内存池

按照threadcache&#xff0c;centralcache&#xff0c;pagecache顺序所列 这里还需要一定的前期准备工作 首先是可以设计一个定长内存池 ObjectPool.h #pragma once #include<iostream> #include"Common.h" using std::cout; using std::endl; using std::…...

springboot mybatis-plus 对接 sqlserver 数据库 批处理的问题

问题&#xff1a; 在对接 sqlserver数据库的时候 主子表 保存的时候 子表批量保存 使用的 mybatis-plus提供的saveOrUpdateBatch 这个方法 但是 报错 报错内容为 &#xff1a; com.microsoft.sqlserver.jdbc.SQLServerException: 必须执行该语句才能获得结果。 框架版本 sprin…...

Acwing---843. n-皇后问题——DFS

n-皇后问题1.题目2.基本思想3.代码实现1.题目 n−皇后问题是指将 n 个皇后放在 nn 的国际象棋棋盘上&#xff0c;使得皇后不能相互攻击到&#xff0c;即任意两个皇后都不能处于同一行、同一列或同一斜线上。 现在给定整数 n&#xff0c;请你输出所有的满足条件的棋子摆法。 …...

Android事件分发机制

文章目录Android View事件分发机制&#xff1a;事件分发中的核心方法onTouchListener和onClickListener的优先级事件分发DOWN,MOVE,UP 事件分发CANCEL代码实践requestdisallowIntereptTouchEvent作用Android View事件分发机制&#xff1a; 事件分发中的核心方法 Android中事件…...

python版协同过滤算法图书管理系统

基于协同过滤算法的图书管理系统 一、简介&#xff08;v信&#xff1a;1257309054&#xff09; ​ 本系统基于推荐算法给用户实现精准推荐图书。 ​ 根据用户对物品或者信息的偏好&#xff0c;发现物品或者内容本身的相关性&#xff0c;或者是发现用户的相关性&#xff0c;然…...

Redis基础入门

文章目录前言一、redis是什么&#xff1f;二、安装步骤1.下载安装包2.安装三、Redis的数据类型redis是一种高级的key-value的存储系统&#xff0c;其中的key是字符串类型&#xff0c;尽可能满足如下几点&#xff1a;字符串(String)列表(List)集合(Set&#xff0c;不允许出现重复…...

【微服务】Feign实现远程调用和负载均衡

目录 1.什么是Feign 2 订单微服务集成Feign 2.1.引入依赖 2.2添加注解 2.3编写Feign的客户端 2.4修改OrderServiceImpl.java的远程调用方法 2.5重启订单服务&#xff0c;并验证 总结 1.什么是Feign Feign是Spring Cloud提供的⼀个声明式的伪Http客户端&#xff0c; 它…...

RTX 3060用户必看:解决nvcc报错‘Unsupported gpu architecture‘的完整指南

RTX 3060显卡CUDA开发实战&#xff1a;彻底解决Unsupported gpu architecture编译错误 当你兴奋地拆开新入手的RTX 3060显卡准备大展拳脚时&#xff0c;却在编译CUDA项目时遭遇了令人沮丧的Unsupported gpu architecture错误。这个看似简单的报错背后&#xff0c;隐藏着CUDA开…...

Gonon无数字时钟:打破传统计时,开启几何编码新时代

【导语&#xff1a;2026年&#xff0c;Tony Gaeta团队推出Gonon无数字时钟&#xff0c;摒弃文化预设&#xff0c;用几何图形计时。它突破传统&#xff0c;解决布局难题&#xff0c;为时间显示带来新方向&#xff0c;有望革新计时领域。】时钟本质与时间层次剖析要打造创新时钟&…...

C# 核心技术解析:Parse vs TryParse 实战指南

文章目录1. 核心区别&#xff1a;暴力型 vs. 稳重型Parse: 默认数据正确TryParse: 典型的 C# 模式示例2. 执行流程图3. 性能4. 高性能方案4.1. 高性能转换&#xff1a;Span<char> 与 Utf8Parser4.2. 执行流程&#xff1a;内存视角4.3. 类型转换对比5. 易混淆在 C# 处理字…...

3090显卡跑ChatGLM-6B LoRA微调:从内存溢出到完美运行的避坑指南

3090显卡实战&#xff1a;ChatGLM-6B LoRA微调显存优化全攻略 当24GB显存的RTX 3090遇上60亿参数的ChatGLM-6B模型&#xff0c;显存管理就像在悬崖边跳舞。本文将分享如何在这块消费级旗舰显卡上完成LoRA微调的全套实战方案&#xff0c;从版本控制到梯度优化&#xff0c;从错误…...

Hasklig字体终极指南:多语言编程环境中的完美适配方案

Hasklig字体终极指南&#xff1a;多语言编程环境中的完美适配方案 【免费下载链接】Hasklig Hasklig - a code font with monospaced ligatures 项目地址: https://gitcode.com/gh_mirrors/ha/Hasklig Hasklig是一款专为程序员设计的等宽字体&#xff0c;通过智能连字技…...

如何构建现代搜索应用:ReactiveSearch与GraphQL的终极集成指南

如何构建现代搜索应用&#xff1a;ReactiveSearch与GraphQL的终极集成指南 【免费下载链接】reactivesearch Search UI components for React and Vue 项目地址: https://gitcode.com/gh_mirrors/re/reactivesearch ReactiveSearch是一个强大的React和Vue搜索UI组件库&a…...

如何借助内网穿透工具实现WinSCP跨系统远程文件管理的稳定连接

1. 为什么需要内网穿透实现WinSCP远程文件管理 作为开发者或运维人员&#xff0c;我经常需要在Windows和Linux服务器之间传输文件。最初我尝试用U盘或网盘中转&#xff0c;但效率太低&#xff1b;后来改用WinSCP直连局域网&#xff0c;又遇到跨地域办公的难题。直到发现内网穿透…...

病床前尽孝心,脊柱 “被折得濒临损伤”!

长期弯腰照顾卧床病人、喂饭、翻身、擦洗&#xff0c;颈腰椎损伤风险显著。弯腰时腰椎弯曲角度过大&#xff0c;椎间盘承受压力剧增&#xff1b;反复弯腰起身照顾病人&#xff0c;肌肉与椎间盘反复冲击&#xff1b;低头专注护理时&#xff0c;颈椎前伸与腰椎受力形成双重负担。…...

超实用AI专著生成攻略,掌握工具技巧,轻松搞定大型学术著作

学术专著创作困境与AI写作工具解决方案 撰写学术专著时的困难&#xff0c;不仅仅体现在“能够写出来”&#xff0c;更关键的是“能够成功出版并获得认可”。在当今的出版行业&#xff0c;学术专著的受众群体相对较小&#xff0c;出版社在选择题材时&#xff0c;对其学术价值以…...

让 TDengine 在 JetBrains IDEs 里更像“原生数据库”一点

让 TDengine 在 JetBrains IDEs 里更像“原生数据库”一点 Author: ChangJin Wei (魏昌进) 最近我做了一个小插件&#xff0c;把 TDengine 接入到了 JetBrains IDEs 的数据库工具链里。 先埋个小提示&#xff1a;文末有彩蛋。 项目地址&#xff1a; GitHub: https://github.…...