Eighteen Z

chrome devtools 的console 和 performance 面板使用方法 和 关键路径知识分享及性能优化方法推荐

HTML的缓存要注意，控制在5分钟以内，或者使用协商缓存。但一定要避免长时间的缓存导致无法更新的情况。针对关键的样式，可以直接写在head部分内，减少请求，是需要权衡HTML的大小，因为HTML通常不会缓存或不会缓存很长时间。preconnect 则可以提前建立连接，在需要获取资源的时候，跳过该步骤。dns-prefetch 的兼容性要比preconnect 的更好，且资源占用更少，所以可以配合使用。需要的资源，被标记的资源优先级会在当前页面调至最低，在浏览器空闲期间进行下载，以便于在下个页面直接从。

主要介绍performance在我们日常开发中所起到的作用，以及如何利用performance 面板进行性能分析和相关优化建议。

查看记录或错误消息运行JavaScript。

本文会围绕小程序的基础原理进行介绍。主要包括小程序的基础结构、编译、加载、通讯等几个方面。旨在阅读完毕后可以对小程序有一个基本的印象。

1. 文字样式丢失且都变成为最小号字体。解决方案： 需要截图的节点根样式添加font-variant: normal；2. 文字向下偏移。解决方案： 指定html2canvas的版本号为1.0.0-alpha.123. 不完整，缺失，留白。出现情况： 当截图区域超过视图高度，且滚动条未处在顶部时，会出现。解决方案： 截图之前控制滚动条至顶部。4. 模糊，不清晰。出现情况： 通常是图片设置为背景的情况下，截图会比较模糊。解决方案： 将背景图通过img标签加定位的方式实现。...

自身height>子元素为block且指定了高度>子元素为block时内容的高度>其他其他包括子元素为行内，行内块，自身的line-height(font-size)等。会以line-height，font-size为最小高度，然后谁大取谁。（最后一部分优先级较为麻烦，不便记忆，以实际效果为准。）...

文章目录前言一、 介绍示例小结二、场景用法1. 四角边框背景2.读入数据总结前言 本文想要介绍一些linear-gradient的更多实用性比较强的用法，前面有根据CSS揭秘总结的讲线性渐变实现条纹背景的方法。CSS揭秘：5.条纹背景（上）一、 介绍示例 background: linear-gradient(red, yellow, blue); background: linear-gradient(red 0%, yellow 50%, blue 100%); back

说明2019/12/26 更新获取歌曲播放地址接口 增加 lyric参数代表是否获取歌词。增加获取歌词接口2019/12/24 更新所有音乐接口更改，增加一层music/ ，获取地址改为 music/song增加福利图片接口示例接口更改为https接口仅供交流学习使用github 项目地址因为之前使用网络上别人封装的音乐api现在无法使用，或者一些需要付费使用，当然...

文章目录前言一、网格1. 网格 First Try总结相关阅读前言上一篇文章中我们学会了如何使用渐变实现条纹状的背景，但是实际上条纹背景并不是我们能实现的唯一的背景图案，利用渐变我们可以实现很多更为复杂的图案，本篇会介绍一些其他的简单而实用的背景图案。提示：以下是本篇文章正文内容，下面案例可供参考一、网格网格的原理其实很简单，目前我们已经实现了条纹背景，那么如果我们将条纹背景组合呢？互相穿插组合，那么是不是很简单就实现了各种各样的网格背景。1. 网格 First Try代码如下：wi

上篇文章讲述了实现条纹效果所使用的CSS特性并实现了水平和垂直条纹，接下来我们来实现斜向条纹。回忆一下之前的效果水平条纹background: linear-gradient(#fb3 33%, #58a 0, #58a 66%, yellowgreen 0);background-size: 100% 60px;垂直条纹background: linear-gradient(90deg, #fb3 33%, #58a 0, #58a 66%, yellowgreen 0);backgro

条纹背景背景知识：CSS线性渐变，background-sizeCSS线性渐变 background: linear-gradient(red, yellow, blue); background: linear-gradient(red 0%, yellow 50%, blue 100%); background: linear-gradient(to right, red 0%, yellow 50%, blue 100%); background: linear-gradien