前端的优化，主要可以通过减少HTTP请求、非实时请求改异步、缓存、文件压缩、CDN加速、独立图片服务器等。
导语 随着移动设备性能不断增强，web 页面的性能体验逐渐变得可以接受，又因为 web 开发模式的诸多好处(跨平台，动态更新，减体积，无限扩展)，APP 客户端里出现越来越多内嵌 web 页面（为了配上当前流行的说法，以下把所有网页都称为 H5 页面，虽然可能跟 H5 没关系），很多 APP 把一些功能模块改成用 H5 实现。 虽然说 H5 页面性能变好了，但如果没针对性地做一些优化，体验还是很糟糕的，主要两部分体验： 页面启动白屏时间：打开一个 H5 页面需要做一系列处理，会有一段白屏时间，体验糟糕。 响
离线存储可以将站点的一些文件存储在本地，它是浏览器自己的一种机制，将需要的文件缓存下来在没有网络的时候可以访问到缓存的对应的站点页面，包括html，js，css，img等等文件在有网络的时候，浏览器也会优先使用已离线存储的文件，返回一个200（from cache）头。这跟HTTP的缓存使用策略是不同的。
结合自己在平时的开发中遇到的各种问题，和浏览各种问题的解决方案总结出一些自己在日常开发中常用的技巧和知点,希望各位不吝斧正。
1.在src目录下新建目录model，在model目录下新建js文件取名storage.js
第一种：url传值 A页面部分js代码 Page({ toDetailPage: function (e) { var zhi = "biubiubiu~~"; wx.naviga
今天来说一下小程序不同页面之间传值的几种方式： 1、URL传值 这种方式最常用，比如: wx.navigateTo({ url: '../detail/detail?cid='+cid+'&ac
最近花了一些时间在项目的性能优化上，背后做了很多工作，但是最后依然没有达到自己想要的结果，有些失望，但是还是记录下自己的执着。
生产环境中，不需要打印日志。通过对webpack进行配置，打包时自动去掉console.log
# 原生小程序 # 什么是小程序？ 无需下载，用完即走（体积太小，刚发布的压缩包体积最大不能超过1M，2017年4月将1M提升2M） # 小程序特点 体积小 同app进行互补的，可以实现app基本的功能 微信扫一扫或者是搜索就可以去下载 开发周期短，成本较低 # 适配方案 viewport适配 width = device-width 单位：rpx iphone6：1rpx = 1物理像素 = 0.5px dpr = 物理像素/设备独立像素 = 2 # 重要的文件 wxml view结构 ---> h
为了加速浏览器，浏览器在用户磁盘上，对最近请求过的文档进行存储。
刚开始撸小程序的时候，觉得看看文档就可以了，导致写了很多垃圾代码坑人坑己，相信大部分初学者也不会去仔细研究文档，更别说啰里啰嗦的指南了，在通读小程序官方指南后，很有必要总结一番。清楚了生命周期和数据通信，就能对整个程序有一定的把控能力，定位问题和解决问题的能力将大幅提高。
在HTML5之前，我们需要接入网络才能访问，这毫无疑问是网站多次请求服务器，造成速度变慢，对于PC用户，网络相对比较稳定，载入速度也不会差太多。但是移动端呢？移动端依赖无线信号、依赖信号塔、位置不固定、受附近建筑影响等。一系列导致网络的不稳定，我们不能改变用户，也不能放弃网络较慢的用户。 还有，在混合app领域，经常使用内置webview加载html页面，如果网速太慢，依然会造成上述问题。
浏览器缓存有多种形式，持久化或者会话存储。以chrome为例，打开调试面板，找到Application选项卡，就可以看到它所支持的各种缓存模式，如下图：
知晓程序员，专注微信小程序开发的程序员！ 一、小程序不同页面之间的传值方式 a、URL传值 这种方式最常用，比如: wx.navigateTo({ url: '../detail/detail?
相信大家也知道大部分的网页版引应用，“不登录就不给看！”，于是，我也给自己的项目添加了这个小细节。如何实现呢？当然是使用路由守卫啦。
今天在微信公众号看到一篇技术博文，想用印象笔记收藏，所以发送了文章链接到pc上。然后习惯性地打开控制台，看看源码，想了解下最近微信用了什么新技术。 呵呵，以下勾起了我侦探的欲望。页面加载后的异常点就是只加载了一个js，如下图所示：
缓存的作用就是提升网页加载速度。浏览器加载一个完整的网页势必会引用外部资源（图片，js，css）。若每次加载网页都要去加载这些外部资源则会引起不必要的时间和资源浪费，且会影响用户体验。而解决上述问题需要一个优秀的缓存策略。除此之外，web缓存的优点还有很多，例如：减轻服务器压力
Html5一大新特性、同时也是非常吸引人的特性，就是其离线功能。它让Web从online延伸到了offline领域。
这个问题在我20年刚开始使用 valine 作为评论的时候就有了，不过当时的作者貌似并没有理会这个问题（原因应该是设计的时候就没有考虑进去这些东西，导致修改的话会更替掉一些东西），评论的隐私信息无非就是ip和邮件，主要还是邮件，一般来说ip默认是关闭的，不过就邮件来说这个东西在评论里只是拿来调用 gravatar 头像和回复邮件提醒用的，我看作者都没所谓我也就没太关注这个，但邮件的确算个人隐私。
大家知道，Vue2.x之后，Vuex状态管理是必须要掌握的一个技术点，今天北妈先介绍下Vuex是什么，然后在介绍几个封装好的操作本地缓存、状态的几个组件，需要的童鞋赶紧拿走，可能有很多人已经再用了，并不是什么高大上的东西，只是让更多的人能加快开发的效率。
毕竟对于前端来说，优化是躲不开的主题。在看200（cache）和304区别的时候，翻到了雅虎这边归纳出来的准则，虽然是十多年前的东西了吧，但是还是具有参考价值的，因此在原文基础上我进行了一些归纳翻译。
本文介绍了VasSonic 2.0版本的主要更新，包括支持自定义请求头和自定义响应头、支持Cache-Control来控制缓存生命周期、支持非UTF-8编码以及新增特性支持。同时，也指出了2.0版本是开源后的首次重大更新，并欢迎社区的开发者参与使用和提建议。
清除缓存是我们开发者经常做的一个操作，我们需要在判断客户端在缺少缓存数据的情况下做出相应的处理
大家好，我是猫头虎，一名全栈软件工程师。今天我们继续微信小程序的学习，重点了解如何在小程序中进行数据存储与本地缓存。这些内容可以帮助你在用户设备上存储数据，提高小程序的性能和用户体验。🚀
腾讯手Q增值团队于今年8月份正式开源了VasSonic，一个轻量级高性能的Hybrid框架。VasSonic框架使用并行加载、动态缓存、增量更新等手段，实现了终端H5页面的秒开，对用户体验的优化做的非常极致。时隔三个月，在业务需求的驱动和开源社区的共同努力下，VasSonic迎来了开源后的第一次重大更新：VasSonic 2.0。 访问VasSonic源码：https://github.com/Tencent/VasSonic VasSonic 2.0新特性介绍 VasSonic 2.0新增了以下几个特性
现代互联网企业，为了进一步提升网站性能，会把静态资源和动态网页分集群部署，静态资源会被部署到 CDN 节点上，网页中引用的资源也会变成对应的部署路径：
在控制台中输入window.performance.timing(html5的属性);
阅读量: 57 动静分离 为了加快网站的解析速度，可以把动态页面和静态页面由不同的服务器来解析，加快解析速度。降低原来单个服务器的压力。 动态页面与静态页面区别 静态资源（css、js、images、html等）： 当用户多次访问这个资源，资源的源代码永远不会改变的资源。 动态资源（php、jsp等）：当用户多次访问这个资源，资源的源代码可能会发送改变。 什么是动静分离 静分离是让动态网站里的动态网页根据一定规则把不变的资源和经常变的资源区分开来，动静资源做好了拆分以后，我们就可以根据静态资源的
我们在之前发布过小程序页面传值方法的简单介绍，说明了在小程序开发中，两种常见的页面之间传值方法。
将数据存储在本地缓存中指定的 key 中。会覆盖掉原来该 key 对应的内容。数据存储生命周期跟小程序本身一致，即除用户主动删除或超过一定时间被自动清理，否则数据都一直可用。
作者：happylindz https://github.com/happylindz/blog/issues/7 前言 最近在看 webpack 如何做持久化缓存的内容，发现其中还是有一些坑点的，正
今天，我们继续「前端面试」的知识点。我们来谈谈关于「Web性能优化」的相关知识点。
同【服务器域名】配置一样在小程序界面配置即可，不过他是作为嵌入的、承载网页的容器。会自动铺满整个小程序页面，小游戏和个人类型的小程序暂不支持使用，我们可以在调试机上看一下效果，它的用法很简单
哈喽大家好，本期是微信小程序专栏第十五期。本期主要内容是使用缓存在本地模拟服务器数据库。主要包括了解应用程序的生命周期、Storage缓存初始化、设置缓存和清理缓存等。 每期内容是连载呢，建议大家可以看看往期内容，更好理解噢~
对于浏览器端的缓存来讲，这些规则是在HTTP协议头和HTML页面的Meta标签中定义的。他们分别从新鲜度和校验值两个维度来规定浏览器是否可以直接使用缓存中的副本，还是需要去源服务器获取更新的版本。
根据文章内容总结为摘要总结。
继前面几篇文章后再来说说老生常谈的话题，怎么样提升前端性能。文中很多取材自网络及《High Performance Web Sites》，并根据自己工作中所接触到的知识整理而成。
文 | Lefe 对于一名 iOS 开发者来说，微信小程序的出现，会让我们感觉到些许的不安。 但接触一段时间后，我发现，其实并不是想象中的那样。微信小程序不可能替代原生 app，也没有绝对的优势战胜原生 app。 不过，微信小程序固然有它的好处，比如我们需要用到的那些不常用的服务。对于小企业来说，小程序可以让他们更便捷地宣传他们的服务，或是给顾客一个更好的线下体验。 那么对于一个 iOS 开发的成员来说，开发小程序会有哪些挑战呢？ 回顾 iOS 开发过程 最基本的 iOS
实例内容 登陆界面 处理登陆表单数据 处理登陆表单数据（异步） 清除本地数据 实例一: 登陆界面 在app.json中添加登陆页面pages/login/login，并设置为入口。 保存后，自动生成相
微信小程序用户的授权分为几种方式，一种是对不同scope的授权，比如userInfo，需要用户手动点击允许才能获取，另一种是通过wx.login静默方式获取code，在与后台服务器交互，访问微信的api来得到会话sessionkey，我这里是两者进行结合，用户授权信息可以获取到微信用户的基本信息，但是用户的openid是存放于userinfo的encryptedData加密数据对象中，还是需要进行后台请求sessionkey进行解密，所以后台请求交互直接通过微信api的code2Session进行一次Get请求获取到openid，下面来进行具体步骤的讲解
内部做了很多优化，从磁盘读取数据时自动在内存构建hash索引，插入数据时自动构建插入缓冲区
PS: 视频播放器不全屏显示 , iOS 10 以下使用 webkit-playsinline 属性
uni-app 是一个使用 Vue.js 开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、H5、以及各种小程序（微信/支付宝/百度/头条/QQ/钉钉）等多个平台。
通常，是因为 cache control 缓存控制策略定义不正确，导致服务端最新部署之后客户端没有接收到最新的更改。
首屏时间（First Contentful Paint），指的是浏览器从响应用户输入网址地址，到首屏内容渲染完成的时间，此时整个网页不一定要全部渲染完成，但需要展示当前视窗需要的内容
pages.json 文件用来对 uni-app 进行全局配置，决定页面文件的路径、窗口样式、原生的导航栏、**底部的原生tabbar **等。
渐进式 web 应用 (Progressive web apps) 简称为 PWA。它可以给用户原生应用的体验。
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
对象存储
即时通信 IM
实时音视频
