Web分享

前言任何研究都不是凭空产生，至少博主是这样的。在手机端拍照后图片很大，有的甚至有 10M 多。这个时候再去上传图片，可想而知，速度是很慢的。正因如此，便有了前端图片压缩这个需求。图片格式传统的图片格式有 git、jpg/jpeg、png 等，谷歌后来推出了另一种压缩比更高的格式 webp。在介绍这几种图片格式前，先说下图片的一些特性。有损和无损有损：指在图片压缩过程中，会丢失一部分图片信息，并且这种丢失是不可逆的。无损：指在图片压缩过程中，图片质量没有损失，任何时候都可以从无损压缩过的

相信用过 Vue 框架的朋友，一定听过 Vue Router。要想写一个复杂的单页应用，没有路由可不行。Vue Router 默认开启的是 hash 模式，如果我们不想让浏览器中的 URL 包含影响美观的 #，我们可以开启 history 模式。不过这种 history 的模式稍微复杂一点，需要后端服务器配合。学东西，最好是知其然，知其所以然。本文将从源码的角度分析 hash 与 history 这两种模式的实现，本文基于 Vue Router 3.5.1 版本。单页应用当我们在浏览器地址栏输入一个

前言为什么要写一篇关于 nextTick 的源码分析呢？主要是因为 nextTick 与 JS 的事件循环（Event Loop）有关，这块知识还是比较重要的，尤其当我们的程序复杂了，很可能就会遇到因为 JS 顺序顺序导致的问题。事件循环JS 执行是单线程的，它是基于事件循环的。事件循环大致分为以下几个步骤：所有同步任务都在主线程上执行，形成一个执行栈（execution context stack）。主线程之外，还存在一个"任务队列"（task queue）。只要异步任务有了运行结果，就在"

学如逆水行舟，不进则退！当今社会，很美好，也很残酷。一般软件或互联网公司，大多数的业务其实是没有很高的难度，所以员工也没有什么机会去提升自己。不过值得庆幸的是，编程界开源风气盛行，功夫秘籍随手可得，而代价仅是你的时间。本次文章的主题是 computed（计算属性） 和 watch（侦听器），代码基于 Vue 2.6.11 版本，和 2.5 还是有一些区别。用法回顾我们先来简单回顾下 computed 和 watch 的用法。computedexport default { name: .

作为一名前端开发人员，读书其实是一件不算太好的选择。因为前端技术发展的太快，很多书出版时可能有些内容已经过时。再加上技术书一般国外写的比较好，如果翻译成中文在发行，那过期的内容可能更多。虽然如此，但是有一些书个人觉得还是值得一读，尤其是读其中的思想。接下来，我会推荐一些自己读过，并且感觉还不错的书籍。...

什么是 TypeScriptTypeScript 是 JavaScript 类型的超集，它可以编译为纯 JavaScript。TypeScript 可以在任何浏览器、任何计算机和操作系统上运行，并且是开源的。TypeScript 由微软开发，截至到目前，最新的 TypeScript 版本为 3.3。TypeScript = ES6 + TypeTypeScript 用于解决什么问题...

如果是文本，我们可以使用 line-height 将其垂直居中。但如果是块级元素，就不能这么做了。尽管如此，我们还是有很多方法可以将一个块级元素垂直居中。绝对定位2D 转换弹性盒子布局绝对定位如果块级元素高度和宽度已知，利用绝对定位和负边距，就可以实现垂直居中。<div class="container"> <div class="content"&gt...

原生 js 实现滚动内容自动切换 Tab

Web 技术飞速发展，但是绝大数技术人员并没有跟上其脚步，博主就是其中一员。当我们还在琢磨上一代技术时，那些技术前沿的弄潮儿开始打造新一代技术。这里聊一聊非高频却十分炫酷的 3D 技术，使用 CSS3 即可实现。二维与三维在说到三维之前，我们先聊一聊二维。二维很好理解，即平面。我们使用 x 轴和 y 轴就可以轻松表示。三维是在二维的基础上增加了一个维度。这个稍微有点难理解，可以参考下图：...

简介一个复杂的应用，其编程语言也必须要有模块机制，方能更好的组织代码。在前端 js 模块中，RequireJS 是一个非常小巧的 JavaScript 模块载入框架，是 AMD 规范最好的实现者之一。特点异步加载模块当我们引入 js 文件时，不会阻塞浏览器对 html 文档的渲染。按依赖顺序加载我们不用在当心 js 文件的引入顺序，RequireJS 会自动帮我们处理依赖关系。模块依...

js 是一种脚本语言，与 PHP 类似。但是如今 PHP 不再仅仅构建一个简单的web 系统，它也在向 Java 看齐，也能够支撑起一个庞大的 web 系统。国外非常有名的脸书网就是一个典型的例子。一门语言，要构建出庞大复杂的系统的基础之一就是语言文件的相互引用。毕竟一个单文件直接实现一个庞大复杂的系统是十分吃力的。后端模块化CommonJs在互联网早期，JavaScript 一直在前端发光发热，但在后端基本上没有什么建树。并且 JavaScript 官方的一些规范也仅仅只是对于前端做了很多要求，.

老实说，个人从来没有重视过 CSS，觉得很简单，没有可学之处。但随着使用和认识的深入，才发现 CSS 也博大精深。加上 CSS3 的出现，以前需要 JavaScript 的地方，现在用 CSS 亦可以轻松实现。相信未来，CSS 一定能大放异彩！这次一起和大家聊一聊 CSS 中的负边距。负边距的特点在正式介绍负边距之前，我们先回顾一下文档流。所谓的文档流，指的是元素排版布局过程中，元...

三栏布局算是网页中最常见的布局之一了。尤其以内容为主的网站，比如优快云、淘宝等。基本都是两侧固定宽度，中间自适应。如果现在让你去实现这么一个三栏布局，你会怎么做呢？利用绝对定位我觉得这是比较古老和容易想到的方式。当初上大学刚接触 CSS 的时候，看到过一个网页，整站都是用绝对定位布局的。当时，觉得理所当然，布局就该这么做…效果如下代码如下&amp;amp;lt;div c...

BFC 全称是 block formatting context，翻译成中文就是块级格式化上下文。在很多 CSS 教程中，很少有直接提到 BFC 的。那这是不是说明 BFC 不重要呢？其实不是的，BFC 在有些地方有着很大的作用。

毫无疑问，随着微信的崛起，移动端网页开发又进一步，需求量不断攀升。但是智能手机市场的丰富多彩，百花齐放，导致移动端的网页开发和传统的 PC 端网页开发有所不同。很多人可能正迈向手机端网页开发，但又听说手机端网页开发有着这样或那样的，所以有些忐忑。这里，博主用近年来开发手机端页面的经历，来告诉大家手机端应该注意哪些问题，同时也会讲一讲这些问题产生的原因以及解决的方法。问题清单&amp;amp;amp;amp;lt;met...