html5 的文章
-
一个专为手机网页前端设计的调试面板-Eruda调试板
Eruda 是一个专为手机网页前端设计的调试面板，类似 DevTools 的迷你版，其主要功能包括：捕获 console 日志、检查元素状态、捕获XHR请求、显示本地存储和 Co……html5 2019年9月9日
-
前端性能优化不完全手册
性能优化是一门大学问，本文仅对个人一些积累知识的阐述，欢迎下面补充。 抛出一个问题，从输入url地址栏到所有内容显示到界面上做了哪些事？ 1.浏览器…… -
如何通过RAIL优化网页CSS性能
前段时间，我将精力专注在Web性能领域；在这个领域下有个重要的课题是如何让网页更丝滑（流畅）。 想让网页变得丝滑，首先，我们需要一个标准来判断什么样…… -
Webpack4如何优化？
今天我们主要聊聊在写webpack配置中，如何优化打包后生成的上线代码 1、tree shaking tree shaking 是一个术语，通常用于描述移除 JavaScript 上下文中…… -
前端开发者必备的Nginx知识
nginx在应用程序中的作用 解决跨域请求过滤配置gzip负载均衡静态资源服务器... nginx是一个高性能的HTTP和反向代理服务器，也是一个通用的TCP/UDP代理…… -
如何使用preload预加载页面资源
本文主要介绍preload的使用，以及与prefetch的区别。然后会聊聊浏览器的加载优先级。 preload 提供了一种声明式的命令，让浏览器提前加载指定资源(加载后…… -
浅谈script标签的defer和async
1. defer和async是什么鬼 今天在做一个小需的时候，忽然看到前辈一句吊炸天的代码 <script src="#link("xxxx/xx/home/home.js")" type="text/javasc…… -
websocket是什么？websocket原理及优点详解
偶然在知乎上看到一篇回帖，瞬间觉得之前看的那么多资料都不及这一篇回帖让我对 websocket 的认识深刻有木有。所以转到我博客里，分享一下。比较喜…… -
Vue开发手机移动端怎么调试页面
在开发移动端页面的时候我们通常是在浏览器完成开发完成，之后才在手机端测试，如果测试出现问题还得重新回到浏览器上寻找错误。甚至还有嵌入在APP的页面，经…… -
设计模式之模板方法 – 深入理解JavaScript系列 41
介绍 模板方法（TemplateMethod）定义了一个操作中的算法的骨架，而将一些步骤延迟到子类中。模板方法使得子类可以不改变一个算法的结构即可重定义该算法的某…… -
设计模式之组合模式 – 深入理解JavaScript系列 40
介绍 组合模式（Composite）将对象组合成树形结构以表示“部分-整体”的层次结构，组合模式使得用户对单个对象和组合对象的使用具有一致性。 常见的场景有asp.ne…… -
设计模式之适配器模式 – 深入理解JavaScript系列 39
介绍 适配器模式（Adapter）是将一个类（对象）的接口（方法或属性）转化成客户希望的另外一个接口（方法或属性），适配器模式使得原本由于接口不兼容而不能一…… -
python如何借助smtp协议发送邮件？
Python如何邮件？我可以基于Python，并借助smtp协议进行邮件发送。在Java开发中，我们会利用POP3协议和SMTP协议借助java类来发送邮件，从而我们了解到，要想…… -
PYPL 9月编程语言排行榜发布 Python一枝独秀
PYPL（PopularitY of Programming Language，编程语言流行指数）9 月份的榜单已经发布了。PYPL 是非常流行的参考指标，其榜单数据的排名均是根据榜单对象在 Google 上相关的搜索频率进行统计排名，原始数据来自 Google Trends，也就是说某项语言或者某款 IDE 在 Google 上搜索频率越高，表示它越受欢迎。 -
什么是HTTP Keep-Alive呢？
在通过调试工具查看网络请求的时候，通常在response header能看到类似下面这种：Keep-Alive: timeout=10, max=94 。那么Keep-Alive到底是什么呢？ HT…… -
理解CSS的vertical-align的属性，以及与line-height的关系
前言 vertical-align用来指定行内元素（inline）或表格单元格（table-cell）元素的垂直对齐方式。也就是说，对于块级元素，vertical-align是不起作用的。 …… -
css盒子模型：内联盒模型、width、height、替换元素、边距、border
css是一门具象语言，并不像js那样具有逻辑性，因此，就算入行了前端很久的工程师，也觉得css难以掌握。下面我们就一步一步揭开css的神秘面纱，深入理解css盒…… -
对css的line-height的属性、行距、x-height的深入理解
前言 行高，顾名思义是一行文字的高度，而从规范上来说则是两行文字基线之间的距离。行高是作用在每一个行框盒子(line-box)上的，而行框盒子则是由内联盒…… -
内联元素img、input为什么可以设置宽和高
元素是文档结构的基础，在CSS中，每个元素生成了一个包含了元素内容的框（box，也译为“盒子”）。但是不同的元素显示的方式会有所不同，例如<div>和<…… -
设计模式之职责链模式 – 深入理解JavaScript系列 38
介绍 职责链模式（Chain of responsibility）是使多个对象都有机会处理请求，从而避免请求的发送者和接受者之间的耦合关系。将这个对象连成一条链，并沿着…… -
设计模式之享元模式 – 深入理解JavaScript系列 37
介绍 享元模式（Flyweight），运行共享技术有效地支持大量细粒度的对象，避免大量拥有相同内容的小类的开销(如耗费内存)，使大家共享一个类(元类)。 享…… -
设计模式之中介者模式 – 深入理解JavaScript系列 36
介绍 中介者模式（Mediator），用一个中介对象来封装一系列的对象交互。中介者使各对象不需要显式地相互引用，从而使其耦合松散，而且可以独立地改变它们之间…… -
设计模式之迭代器模式 – 深入理解JavaScript系列 35
介绍 迭代器模式(Iterator)：提供一种方法顺序一个聚合对象中各个元素，而又不暴露该对象内部表示。 迭代器的几个特点是： 访问一个聚合对象的内容而无需暴露…… -
设计模式之命令模式 – 深入理解JavaScript系列 34
介绍 命令模式(Command)的定义是：用于将一个请求封装成一个对象，从而使你可用不同的请求对客户进行参数化；对请求排队或者记录请求日志，以及执行可撤销的操…… -
设计模式之策略模式 – 深入理解JavaScript系列 33
介绍 策略模式定义了算法家族，分别封装起来，让他们之间可以互相替换，此模式让算法的变化不会影响到使用算法的客户。 正文 在理解策略模式之前，我们先来一……