lulula的博客

钱钱钱钱前端

h5 图片资源的引用和使用注意事项总结

写在前面的话 最近做的项目有很多图片资源,引发了自己对图片的渲染和使用等进行了深入的思考,如何优化性能?如何提高体验?背后的原因是怎样的?等等等,故记此文。 图片渲染的过程 一些必要的题外话。 页面的渲染过程 解析HTML —> 构建DOM树 加载样式 —&gt...

2019-04-28 16:48:06

阅读数 36

评论数 0

重新认识相对定位和绝对定位

相对定位 相对自身定位定位 不脱离文档流 绝对定位 相对position 不为 static 的父元素定位 脱离文档流 如果父元素全部为static则相对视窗定位 绝对定位的元素可以通过指定top和bottom ,保留height未指定(即auto),来填充可用的垂直空间。它们同样可以通过指...

2019-03-19 21:07:23

阅读数 22

评论数 0

美团点评前端面试

前言 第一次面试还是非常紧张的,是在boss直聘上找的。 面试题 一个div实现旋转的太极图 面试时没有答出来,之后想出来了 http://liulu666.cn/taiji.html 垂直水平居中 这个基础,我在自己博客也有总结 https://liu354.github.i...

2019-03-09 14:54:50

阅读数 44

评论数 0

git ssh配置

自己简单的配置了下,发现每次ssh clone时都需要密码,非常不爽,故记此文 生成密钥,一路回车、用默认选项 ssh-keygen -t rsa 复制到粘贴板 cat ~/.ssh/id_rsa.pub | clip # Windows cat ~/.ssh/id_rsa.pub |...

2019-01-24 15:07:02

阅读数 25

评论数 0

从0到1徒手撸一个简单的glup插件

参考http://www.alloyteam.com/2016/01/9918/#comments 但这位大兄弟的代码跑不起呀、自己简单修改了下 http://nodejs.cn/api/fs.html node官网 https://www.gulpjs.com.cn/docs/api/ glu...

2019-01-15 17:43:43

阅读数 45

评论数 0

小米web前端实习面经

前言 小米非常重视数据结构,我同学面试后端同样也问了很多数据结构,但自己在这方面的学习还不够。。。一上午完成两轮面试 面试题 闭包 问的很细,还要求写代码举例 继承 同上 面向对象编程、面向对象的三大特征 这个之前自己了解比较少,三大特性是指 封装、继承、多态 https://segmentf...

2018-11-08 15:13:50

阅读数 87

评论数 0

浏览器渲染页面的过程

打开一个网页发生了什么? 输入一个网址,打开一个网页 DNS 查询 TCP 连接 HTTP 请求即响应 服务器响应 客户端渲染 浏览器对内容的渲染便发生在第五步。 客户端渲染具体过程 处理 HTML 标记并构建 DOM 树。 处理 CSS 标记并构建 CSSOM 树。 将 DOM 与 CSS...

2018-11-01 15:44:27

阅读数 108

评论数 0

BFC浅析

BFC到底使什么? BFC概括:可以在心中记住这么一个概念———所谓的BFC就是css布局的一个概念,是一块区域,一个环境。 BFC布局规则 关于这些不同 box,下文会解释,别慌~ 内部的Box(Block-level box)会在垂直方向,一个接一个地放置。 内部的Box(Block-lev...

2018-10-31 11:15:09

阅读数 30

评论数 0

js 实现链表和树的结构

最近在学习es6 所以代码主要使用了es6的一些东西 链表的设计 我们设计链表包含两个类,一个是 Node 类用来表示节点,另一个事 LinkedList 类提供插入节点、删除节点等一些操作。 /** * 一般的语言实现链表都需要指针来实现 * ...

2018-10-28 15:22:28

阅读数 100

评论数 0

js 继承和深浅拷贝问题

继承 function A(){} function B(){} 两个构造函数,让B继承A 直接通过 new A() B.prototype=new A(); 这种方式有一个弊端,会额外执行一次A的构造函数,增加开销,甚至可能会造成内存泄漏。 通过Object.create() B.proto...

2018-10-26 20:41:56

阅读数 38

评论数 0

js 构造函数的返回值

在传统语言中,构造函数不应该有返回值,实际执行的返回值就是此构造函数的实例化对象。 而在js中构造函数可以有返回值也可以没有。 没有返回值则按照其他语言一样返回实例化对象。 若有返回值则检查其返回值是否为引用类型。如果是非引用类型,如基本类型(string,number,boolean,n...

2018-10-26 19:54:20

阅读数 171

评论数 0

vue 中使用引用类型的注意事项

前言 js 中对象Object、数组Array都是引用类型。 引用类型var a={name:'tom'}; var b=a; a={}; console.log(b.name) //tom 当用变量声明一个引用类型时,实际上这个变量不是引用类型本身,而是一个指向这个引用类型的指针。 Vu...

2018-10-16 15:16:33

阅读数 299

评论数 0

web端重构微信小程序 图片上传

注意 一般情况上传照片有两种方式: 本地图片转换成base64,然后通过普通的post请求发送到服务端。  操作简单,适合小图,以及如果想兼容低版本的ie没办法用此方法  使用 通过form表单提交。 form表单提交图片会刷新页面,可以实现无刷新提交数据。 可以把form绑定到一个隐藏的ifr...

2018-10-06 13:26:11

阅读数 143

评论数 0

React使用next.js实现服务器端渲染

什么是服务端渲染及优势 服务端渲染(Server side rendering),是指通过服务器执行React页面的渲染和生成,并返回给客户端静态的HTML页面。 服务端渲染主要优势: SEO 首屏渲染友好 速度相对快 使用React编写出来的程序是单页的应用程序,前端请求会都是一个ht...

2018-09-03 15:06:42

阅读数 436

评论数 0

HTML5应用程序缓存Application Cache

浏览器本身的缓存机制 浏览器会对静态文件(html csss js 图片等)进行自动缓存 下一次访问该网页,会读取缓存 读取缓存之前进行判断, 第一判断缓存时间和服务器上文件的最后一次修改时间 如果缓存时间大于最后一次修改时间, 证明缓存之后,服务器上没有对文件进行修改,此时,浏览器会直接读取...

2018-08-24 12:28:19

阅读数 96

评论数 0

原生js实现简单的文件预览上传

FileReader对象 事件处理 FileReader.onabort 处理abort事件。该事件在读取操作被中断时触发。 FileReader.onerror 处理error事件。该事件在读取操作发生错误时触发。 FileReader.onload 处理l...

2018-07-30 15:03:28

阅读数 627

评论数 0

原生js实现移动端touch事件,解决穿透问题

四种touch事件 touchstart: //手指放到屏幕上时触发 touchmove: //手指在屏幕上滑动式触发 touchend: //手指离开屏幕时触发 touchcancel: //系统取消touch事件的时候触发 每个触摸事件被触发后,会生成...

2018-07-30 14:41:59

阅读数 2225

评论数 0

JS前端创建html浏览器导出下载

HTML与文件下载 主要用的html5的download属性和Blob URL.createObjectURL URL.createObjectURL()方法会根据传入的参数创建一个指向该参数对象的URL. 这个URL的生命仅存在于它被创建的这个文档里. 新的对象URL指向执行的File...

2018-03-16 19:25:25

阅读数 696

评论数 0

offsetLeft,Left,clientLeft详解

背景 最近写了一个滑动条,发现自己的对offsetLeft,Left,clientLeft这几个的概念还不是很清楚,于是决定细细研究下。 分类 client部分 clientHeight:内容可视区域的高度,也就是说页面浏览器中可以看到内容的这个区域的高度(不含边框,也不包含滚动条...

2018-03-15 22:32:24

阅读数 246

评论数 0

jq实现查看预览图

功能 鼠标移到缩略图上会显示该图的大图,并且大图跟随鼠标移动;或是移动到提示文字上,也可以显示图片。并且含有方向判别功能,具体来说就是如果缩略图在页面的左半部分,则大图显示在鼠标的右侧,如果缩略图在页面的右半部分,则预览的大图在鼠标的左侧显示。 思路分析 html结构 &amp...

2018-03-08 22:31:01

阅读数 800

评论数 0

提示
确定要删除当前文章?
取消 删除
关闭
关闭