web前端
关注
分享
扫一扫
文章平均质量分 85
JuLi距离
努力成为一位优秀的前端工程师
展开
-
React 16.8.6 版本存在内存泄露
发现这个React 内存泄露问题是某一天的晚上一直开着直播页，直播页用的 react 版本是 16.8.6，到了早上跳到这个页面的时候，控制台有点卡，怀疑是有内存泄露，于是就开始分析这个直播页面。分析打开控制台 performance 面板点击开始录制，如下：从上图可以发现在这时间内， nodes 节点一直在增长，很有可能发生了内存泄露。我们来到 memory 面板分析内存变化:...原创 2020-04-16 14:14:31 · 1018 阅读 · 0 评论 -
页面CPU和内存占用监控可视化Chrome插件-Graph Process
写这个插件的原因是最近要对比一下页面的 cpu 和内存占用的性能，本来是想找看看有没有什么软件能够去可视化一下当前标签页的cpu和内存占用，但是发现却找不到这种软件，mac 上有个活动监视器，但是当你开很多标签页的话并不很好的监听当前标签页的 cpu 和内存占用，能看到谷歌浏览器的 rendered 进程，但是谷歌浏览器的 rendered 进程很多你并不知道是哪个，而且也没有可视化进行查看平...原创 2019-10-15 19:03:23 · 6990 阅读 · 4 评论 -
html5调用摄像头功能
前言 前些天，线上笔试的时候，发现需要浏览器同意开启摄像头，感觉像是 js 调用的，由于当时笔试，也就没想到这么多��。今天闲来无事，看了下自己的 todo，发现有这个调用摄像头的todo，才想到��。网上查了一下，果然 js 有调用摄像头的 api，为此自己写一个 demo ，避免忘记。正文调用摄像头一共有两种实现方式，一种是使用navigator.getUserMedia（该特性已经从 W原创 2018-05-05 23:04:54 · 29783 阅读 · 4 评论 -
Vue全家桶+TypeScript使用总结
前言 最近重构了我之前项目 qq 音乐移动端，使用的技术是 vue，vuex，vue-router，和 typescript，在这期间，遇到的问题还是蛮多的，一会儿我会把我遇到的问题以及解决方法列出来，避免忘记。重构完成的项目 ===> vue-qq-musicTypeScript与Vue全家桶的配置可以参考以下两篇文章（在这里由衷感谢两位作者）：vue + type...原创 2018-03-01 14:19:06 · 25766 阅读 · 0 评论 -
node简单实现一个更改头像功能
前言 一直想写这篇文章，无奈由于要考试的原因，一直在复习，拖延到现在才写��，之前用 node 的 express 框架写了个小项目，里面有个上传图片的功能，这里记录一下如何实现（我使用的是 ejs）��思路首先，当用户点击上传头像，更新头像的时候，将头像上传到项目的一个文件夹里面（我是存放在项目的public/images/img里面），并且将图像名重命名（可以以时间戳来命名）。同时图片原创 2017-12-28 12:46:13 · 2150 阅读 · 1 评论 -
vscode 前端插件推荐
常用插件Auto Close Tag 自动添加HTML / XML关闭标签（必备）Auto Rename Tag 自动重命名配对的HTML / XML标签(必备)Beautify 格式化javascript，JSON，CSS，Sass，和HTMLBootstrap 4 & Font awesome snippets 包含Bootstrap 4＆Font awesome 的代码片原创 2017-10-30 16:54:25 · 2849 阅读 · 0 评论 -
前端学习笔记之观察者模式
观察者模式也称”发布-订阅”模式,它的作用就是当一个对象的状态发生改变时，所有依赖于它的对象都将得到通知，自动刷新对象状态举个生活比较常见常见的例子,比如你去面试之后，面试官看你表现不错，最后会跟你要联系方式，以便之后可以联系你。在这角色扮演当中，你就是“订阅者”，面试官就是“发布者”。那么发布订阅模式是咋实现的呢？思路 1. 给定一个发布者 2. 面试者将联系方式给发布者 3. 发布者的一原创 2017-10-05 15:01:44 · 1513 阅读 · 0 评论 -
使用 react 总结
最近学了一些 react 和es6 的一些知识，并且使用 react 写了一个 TodoList 项目===>预览 && 源码 感觉学的挺多的，并且遇到的坑也不少��，说实话，一开始学 react 看到 jsx 语法有点不适应，说好的结构和行为分离呢��，不过随着通过一个项目的完成，渐渐明白了这么写的好处好处自定义标签结构清晰代码模块化更加语义化不过也有缺点浏览器不支持这语法必须通过原创 2017-10-02 15:23:20 · 1018 阅读 · 0 评论 -
前端面试题：从url到页面展现，这之中发生了什么？
我们平常在地址栏里输入一些网址时，页面很快就会出现，但在这之中到底发生了什么事情呢？大概是这样的流程：在浏览器的地址栏中敲入了url域名解析服务器处理请求浏览器处理绘制网页一、在浏览器的地址栏中敲入了url首先，我们要知道url是什么？URL（Uniform Resource Locator），统一资源定位符，用于定位互联网上的资源，实际上就是网站网址。url的格式一般为： 协议类原创 2017-05-06 20:16:53 · 3497 阅读 · 0 评论 -
解决inline-block元素的 bug
在使用inline-block时，有时候出现的效果莫名奇妙，例如： * 两个inline-block 元素之间如果有空格、回车、tab，那么在页面上就有一个空隙 * 两个不同高度的 inline-block 元素顶部无法对齐，或者使用inline-block下面无缘无故多出几像素例子1,出现空隙<!DOCTYPE html><html><head> <meta charset="原创 2017-08-30 21:19:46 · 753 阅读 · 0 评论 -
浮动
1. 块级元素浮动将并排显示，不再独占一行示例代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compat原创 2017-07-01 16:16:26 · 396 阅读 · 0 评论 -
前端小项目：使用canvas绘画哆啦A梦
最近在学canvas元素,标签只是图形容器，必须使用js来绘制图形。为了增强对canvas元素的理解,于是用canvas画了一个哆啦A梦来要实现的效果图要想绘画出这个哆啦a梦首先要掌握以下一些函数： - arcTo() - canvas绘制圆形或弧线 - bezierCurveTo() - quadraticCurveTo() 开始绘画！！首先我们需要创建一个400*600的画布，代码如下原创 2017-04-22 07:18:56 · 1336 阅读 · 0 评论 -
前端学习笔记之常用的命名（详细）
1. 常用命名 页头：header 登录条：loginBar 标志：logo 侧栏：sideBar 广告：banner 导航：nav 子导航：subNav 菜单：menu 子菜单：subMenu 搜索：search 滚动：scroll 页面主体：main 内容：content 标签页：tab 文章列表：list原创 2017-04-19 21:14:47 · 3901 阅读 · 0 评论 -
前端学习笔记之js中apply()和call()方法详解
经过网上的大量搜索，渐渐明白了apply()和call方法的使用，为此写一篇文章记录一下。定义apply()方法： Function.apply(obj,args) obj：这个对象将代替Function类里this对象 args：这个是数组，它将作为参数传给Function(args–>arguments）call()方法： Function.call(obj,[param原创 2017-04-15 11:15:23 · 3218 阅读 · 1 评论 -
前端学习笔记之Html标签元素类别
HTML 中的标签元素可以分为三种不同的类型：块状元素、内联元素和内联块状元素。块状元素的特点有：1、独占一行。每个块级元素都从新的一行开始，并且其后的元素也另起一行。2、元素的高度、宽度、行高以及顶和底边距都可设置。3、可以设置高度，如果不设置元素的高度，则其高度与父元素的高度一致。常用的块状元素有： <div>、<p>、<ol>、<ul>、<table>、<blockquote>、<form原创 2017-04-08 20:09:23 · 551 阅读 · 0 评论