前端综合
零零历险记
一点一点
展开
-
位运算在js的应用
位运算原创 2022-11-18 15:30:23 · 193 阅读 · 0 评论 -
常见的几个meta标签元素
指定字符集<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>向搜索引擎说明你的网页的关键字<meta name="keywords" content="关键字"/>告诉搜索引擎你的站点的主要内容<meta name="description" content=""/>定时让网页在指定的时间内跳转<meta http-equiv="refresh".原创 2021-10-09 09:55:46 · 155 阅读 · 0 评论 -
前端的埋点
手动埋点手动埋点的技术本质是什么呢?我们看看从javascript中能轻松获得哪些信息:域名:document.domainURLdocument.URL页面标题:document.title分辨率:window.screen.height & window.screen.width颜色深度:window.screen.colorDepthReferrer:document.referrer客户端语言:navigator.language除了上面列举的常规信息以外,还有大量.原创 2021-10-09 09:47:53 · 144 阅读 · 0 评论 -
内容安全策略(CSP)详解
内容安全策略(CSP),其核心思想十分简单:网站通过发送一个 CSP 头部,来告诉浏览器什么是被授权执行的与什么是需要被禁止的。其被誉为专门为解决XSS攻击而生的神器。 1.CSP是什么 CSP指的是内容安全策略,为了缓解很大一部分潜在的跨站脚本问题,浏览器的扩展程序系...转载 2021-10-08 14:52:01 · 2107 阅读 · 0 评论 -
如何清楚易懂的解释“UV和PV"的定义?
原创 2021-09-29 15:32:19 · 598 阅读 · 0 评论 -
tree shaking 及其工作原理
写在前面 今天这道题目是在和小红书的一位面试官聊的时候: 我:如果要你选择一道题目来考察面试者,你最有可能选择哪一道? 面试官:那应该就是介绍一下tree shaking及其工作原理? 我:为什么? 面试官:是因为最近面了好多同学,大家都说熟悉webpack,在项目中如何去使用、如何去优化,也都或多或少会提到tree shaking,但是每当我深入去问其工作机制或者原理时,却少有人能回答上来。(小声 bb:并不是我想内卷,确实是工程师的基本素养啊,哈...转载 2021-09-29 14:40:38 · 581 阅读 · 0 评论 -
js实现前端性能监控与错误监控
前端监控一般包括:1.性能监控;2.错误监控1.前端性能这里引用他人文章对前端性能的描述:通常前端性能可以认为是用户获取所需要页面数据或执行某个页面动作的一个实时性指标,一般以用户希望获取数据的操作到用户实际获得数据的时间间隔来衡量。简单的总结一下,就是一般用时间来衡量前端性能。比如一些耳熟能详的:白屏时间、首屏时间等那么当我们打开一个网页,如果获取跟网页性能相关的时间呢?2.性能数据采集打开控制台,输入window.performance可以看到performance对象的组成,其中我们关注一原创 2021-09-23 16:10:11 · 1784 阅读 · 0 评论 -
什么是跨域?跨域解决方法
一、为什么会出现跨域问题 出于浏览器的同源策略限制。同源策略(Sameoriginpolicy)是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,则浏览器的正常功能可能都会受到影响。可以说Web是构建在同源策略基础之上的,浏览器只是针对同源策略的一种实现。同源策略会阻止一个域的javascript脚本和另外一个域的内容进行交互。所谓同源(即指在同一个域)就是两个页面具有相同的协议(protoco...转载 2021-09-16 14:00:24 · 203 阅读 · 0 评论 -
html的解析过程
创建Document对象,开始解析web页面,解析HTML元素和字符数据,添加Element节点和text节点到Document中,此时,document.readyState = loading2.遇到 link 外部 CSS,创建线程加载,并继续解析文档3.遇到 script 外部Js:(1)未设置 async、defer浏览器加载Js,并堵塞,等待Js加载完成后执行脚本,然后继续解析文档(2)设置 async异步加载脚本,脚本加载完立即执行脚本(3)设置defer异步加载脚本,等待.转载 2021-09-10 10:24:44 · 635 阅读 · 0 评论 -
HTML的语言编码charset
html的header部分加上<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />CSS文件顶部加上@charset "utf-8";GB2312编码可以通俗理解为国内通用的语言。UTF-8可以通俗理解简体繁体可用此编码如台湾和内地使用此编码。...原创 2021-09-07 13:58:29 · 422 阅读 · 0 评论 -
懒加载原理以及实现
原理一张图片就是一个标签,浏览器是否发起请求图片是根据的src属性,所以实现懒加载的关键就是,在图片没有进入可视区域时,先不给的src赋值,这样浏览器就不会发送请求了,等到图片进入可视区域再给src赋值。懒加载思路及实现实现懒加载有四个步骤,如下:1.加载loading图片2.判断哪些图片要加载【重点】3.隐形加载图片4.替换真图片...原创 2021-07-22 09:10:26 · 778 阅读 · 0 评论 -
前端图片选择
学习目标:提示:这里可以添加学习目标例如:一周掌握 Java 入门知识学习内容:提示:这里可以添加要学的内容例如:1、 搭建 Java 开发环境2、 掌握 Java 基本语法3、 掌握条件语句4、 掌握循环语句学习时间:提示:这里可以添加计划学习的时间例如:1、 周一至周五晚上 7 点—晚上9点2、 周六上午 9 点-上午 11 点3、 周日下午 3 点-下午 6 点学习产出:提示:这里统计学习计划的总量例如:1、 技术笔记 2 遍2、CSDN 技术博客 3 篇原创 2020-11-12 13:42:28 · 280 阅读 · 0 评论 -
html标签中的meta charset=“utf-8“
charset是规定HTML文档的字符编码;charset=gb2312不能用繁体字,而charset=utf-8可以用繁体首先来说明一下“utf-8”是一种字符编码。charset=”utf-8”是告知浏览器此页面属于什么字符编码格式,下一步浏览器做好“翻译”工作。常见的字符编码有:gb2312、gbk、unicode、utf-8。各个字符编码含义:gb2312:代表国家标准第2312条,其中是不包含繁体的(虽然咱们不怎么使用繁体了,但是台湾还在使用繁体啊。那怎么办呢?)。gbk:国家标准扩展版原创 2020-11-09 08:31:03 · 7567 阅读 · 0 评论 -
TCP与UDP的区别
TCP协议 TCP协议全称传输控制协议,就是对传输过程中的数据有一定的控制!我们来看看它的包头的样子! 我们来分析分析每部分的含义和作用: 源端口号/目的端口号: 表示数据从哪个进程来, 到哪个进程去. 32位序号: 4位首部长度: 表示该tcp报头有多少个4字节(32个bit) 6位保留: 顾名思义, 先保留着, 以防万一 6位标志位 URG: 标识紧急指针是否有效 ACK: 标识确认序号是否有效 PSH: 用来提示接收端应用程序...转载 2020-09-28 22:48:32 · 129 阅读 · 0 评论 -
HTTP与UDP的区别比较
TCP(Transmission Control Protocol,传输控制协议)与UDP(User Data Protocol,用户数据协议)是互联网传输数据较为常用的协议,我们熟知的HTTP就是基于TCP的。二者区别:1. 连接类型:TCP是面向连接的协议,要传输数据必须先进行连接,就是常说的“三次握手”,握手成功建立连接之后才能进行数据的传输交互,如同微信视频聊天需要对方接受才能彼此看到。UDP是非面向连接的协...转载 2020-09-13 14:08:36 · 1416 阅读 · 0 评论 -
前端动画总结
常有迎面风, 过后不觉明; 时遇动画求, 一探知深浅。经常被问及,实现动画的方案主要有6种:1. 利用JavaScript的setInterval或setTimeout方法的回调函数来调用某个元素css的样式以达到动画的效果 <div id="rect"></div>15 <script>16 let elem = document.getElementById('rect');17 let left = 0;18原创 2020-08-13 22:51:04 · 278 阅读 · 0 评论