<p>的最新内容，更新于<strong>2019-12-01</strong>。大家完全不用担心这篇文章会过时，因为随着 前端技术的更新，本文也会随之更新。 </p><p>本文的最新内容也会在<a href="https://github. ...

<h2 id="_1">图片格式和应用场景</h2> <h3 id="jpeg">JPEG 格式</h3> <p>JPEG（Joint Photographic Experts Group）是一种针对彩色照片而广泛使用的有损压缩图形格式，属 ...

<h2 id="_1">前端性能优化认知</h2> <h3 id="_2">什么是前端性能优化</h3> <p>通常来讲，前端性能优化是指：从用户开始访问网站到整个页面完整地展现出来的过程中，通过各种优化策略和优化方法，让页面加载得更快，让 ...

<h2 id="_1">浏览器的渲染机制</h2> <p>我们需要先理解浏览器的渲染经历了哪些过程，才能有针对性的进行相关优化。</p> <p>掌握浏览器的渲染优化，可以说是前端工程师的一个分水岭。如果想要具备架构师的思维，需要达到什么样的 ...

<h2 id="_1">浏览器渲染过程</h2> <p><img alt="" src="https://img.smyhvae.com/20210114_2115.png"/></p> <ol> <li> <p>浏览器解析 HTML，生成 ...

<h2 id="_1">前言</h2> <p><strong>渲染机制</strong>包括的内容：</p> <ul> <li> <p>什么是DOCTYPE及作用</p> </li> <li> <p>浏览器渲染过程。面试经常会问：在浏览器中 ...

<h2 id="_1">性能指标和优化目标之：加载</h2> <p>性能指标：我们在性能优化过程中可以参考的标准。这些标准都是业界或者前人总结出来的指导性经验。我们可以参考这些指标，去指导我们自己的优化。</p> <h3 id="_2">打 ...

<p>发积累 </p><h3 id="001scoped">001：scoped 关键字的作用</h3> <p>在 <code>xx.vue</code> 组件中，我们可能会遇到带 <code>scoped</code> 关键字的样式。比如 ...

<h2 id="dom">DOM操作练习</h2> <h3 id="1">举例1：点击按钮时，显示和隐藏盒子。</h3> <p>代码实现：</p> <pre class="codehilite"><code class="language- ...

<p>我们在上一篇文章中制作的网页最顶部的导航，是属于网页导航。</p> <p>本文中，Banner图上方的导航，叫做<strong>快捷导航</strong>（shortcut）。</p> <h2 id="_1">快捷导航的骨架</h2> ...