蓝戒的博客_逐梦天空-专注于web前端开发|用户体验_Page 3
Oct 11 2018
Particleground简介：
Particleground是一个JavaScript插件，用于时髦的后台粒子系统。包括鼠标在桌面设备和移动设备上的陀螺仪控制的可选视差效果。在支持HTML5画布的浏览器中工作。
查看demo
初始化：
particleground(document.getElementById('your-element');
注意事项：
v1.0.0以上版本支持js原生调用，不必依赖jquery。
具体使用方法：
1）引... 阅读全文
Oct 10 2018
momentJS使用及中文API
一、momnetJS使用
1. npm安装
npm install moment --save # npm
或者官网http://momentjs.com/ 下载js文件script标签引入
2. momentJS使用示例：
2.1. 格式日期：
moment(data).format("YYYY-MM-DD"); // data为日期的字符串形式
moment().format("YYYY-MM-DD"); // 输出当前日期
moment().format('YYYY年MM... 阅读全文
Oct 09 2018
前情介绍：
最近做的一个vue项目中，使用echart图表组件展示数据，展示方式是点击按钮弹出弹层，在弹层中展示图表，使用vue组件方式：通过监听数据变化，在调用图表组件的页面中使用如下方法刷新数据:
this.$nextTick(function() {
// 在这里赋值图表数据，渲染视图
})
问题描述：
弹出层的图表展示有时无法100%自适应宽度，图表数据展示如果是在页面中正常初始化就... 阅读全文
Sep 28 2018
eruda--移动端调试神器：
Eruda 是一个专为手机网页前端设计的调试面板，类似 DevTools 的迷你版，其主要功能包括：捕获 console 日志、检查元素状态、显示性能指标、捕获 XHR 请求、显示本地存储和 Cookie 信息、浏览器特性检测等等。
1.eruda安装
npm i eruda --save
2.Main.js 引用
import eruda from 'eruda'
eruda.init();
3.开启面板
面板简介：
1）. con... 阅读全文
Sep 20 2018
概念理解
函数节流和函数防抖，两者都是优化高频率执行js代码的一种手段。
函数节流（throttle）与 函数防抖（debounce）都是为了限制函数的执行频次，以优化函数触发频率过高导致的响应速度跟不上触发频率，出现延迟，假死或卡顿的现象。
函数防抖（debounce）
当调用动作过n毫秒后，才会执行该动作，若在这n毫秒内又调用此动作则将重新计算执行时间
函数节流（throttle）
预先设定... 阅读全文
Sep 09 2018
1、SyntaxError
SyntaxError是解析代码时发生的语法错误
// 变量名错误
var 1a;
// 缺少括号
console.log 'hello');
2、ReferenceError
ReferenceError是引用一个不存在的变量时发生的错误。
unknownVariable
// ReferenceError: unknownVariable is not defined
另一种触发场景是，将一个值分配给无法分配的对象，... 阅读全文
Jul 25 2018
一、 PWA登场背景
很长时间以来我们对项目采用web app 还是 native app的选择上有一些不可调和的矛盾点，究其实质就是用户体验和性能成本问题。
Web App vs Native App 优缺点对比：
理想很美好，优点：
开发成本较低：使用web开发技术就可以轻松的完成web app的开发。
维护比较轻松：web app和一般的web一样，维护比较简单，它其实就是一个站点。
跨平台：一套代码实现a... 阅读全文
Jun 27 2018
最近做的在线竞答的项目需要使用websocket保持实时通讯，实现同步推题多用户在线竞答。在做过的过程中发现websocket断线频率较高，通过网上查询资料了解到nginx代理的websocket转发，无消息连接会出现超时断开问题。网上资料提到解决方案两种，一种是修改nginx配置信息，第二种是websocket发送心跳包。
下面就来总结一下本次项目中实践中解决的websocket的断线 和 重连 这两个问题的解... 阅读全文
Jun 27 2018
随着web技术的飞速发展，1999年制定的HTTP 1.1已经无法满足大家对性能的要求，Google推出协议SPDY，旨在解决HTTP 1.1中广为人知的性能问题。SPDY得到了Chrome、Firefox和Opera的支持，很多大型网站（如谷歌、Twitter、Facebook、淘宝）都对兼容客户端使用SPDY。SPDY在被行业采用并证明能够大幅提升性能之后，已经具备了成为一个标准的条件。
HTTP工作组采用了SPDY v2草案作为制定HTTP 2.... 阅读全文
May 09 2018
handsontable是目前在前端界最接近excel的插件，可以执行编辑，复制粘贴，插入删除行列，排序等复杂操作。拥有jQuery、react、ng和vue版本，功能强大，是复杂表格的不二之选。
下面介绍一下handsontable表格控件在vue项目中的使用方法：
1.安装模块包
npm install @handsontable/vue --save
npm install handsontable --save
这样安装完handsontable依赖的各模块（moment、... 阅读全文
来自的朋友,欢迎您
点击这里 订阅我的博客 o(∩_∩)o~~~
Particleground简介： Particleground是一个JavaScript插件，用于时髦的后台粒子系统。包括鼠标在桌面设备和移动设备上的陀螺仪控制的可选视差效果。在支持HTML5画布的浏览器中工作。 查看demo 初始化： particleground(document.getElementById('your-element'); 注意事项： v1.0.0以上版本支持js原生调用，不必依赖jquery。 具体使用方法： 1）引...阅读全文抢沙发
momentJS使用及中文API 一、momnetJS使用 1. npm安装 npm install moment --save # npm 或者官网http://momentjs.com/ 下载js文件script标签引入 2. momentJS使用示例： 2.1. 格式日期： moment(data).format("YYYY-MM-DD"); // data为日期的字符串形式 moment().format("YYYY-MM-DD"); // 输出当前日期 moment().format('YYYY年MM...阅读全文
前情介绍： 最近做的一个vue项目中，使用echart图表组件展示数据，展示方式是点击按钮弹出弹层，在弹层中展示图表，使用vue组件方式：通过监听数据变化，在调用图表组件的页面中使用如下方法刷新数据: this.$nextTick(function() { // 在这里赋值图表数据，渲染视图 }) 问题描述： 弹出层的图表展示有时无法100%自适应宽度，图表数据展示如果是在页面中正常初始化就...阅读全文作者：cywcd | 分类：javascript | 阅读： 4,432 次 | 标签：echart
eruda--移动端调试神器： Eruda 是一个专为手机网页前端设计的调试面板，类似 DevTools 的迷你版，其主要功能包括：捕获 console 日志、检查元素状态、显示性能指标、捕获 XHR 请求、显示本地存储和 Cookie 信息、浏览器特性检测等等。 1.eruda安装 npm i eruda --save 2.Main.js 引用 import eruda from 'eruda' eruda.init(); 3.开启面板 面板简介： 1）. con...阅读全文作者：cywcd | 分类：javascript | 阅读： 2,768 次 |
概念理解 函数节流和函数防抖，两者都是优化高频率执行js代码的一种手段。 函数节流（throttle）与 函数防抖（debounce）都是为了限制函数的执行频次，以优化函数触发频率过高导致的响应速度跟不上触发频率，出现延迟，假死或卡顿的现象。 函数防抖（debounce） 当调用动作过n毫秒后，才会执行该动作，若在这n毫秒内又调用此动作则将重新计算执行时间 函数节流（throttle） 预先设定...阅读全文作者：cywcd | 分类：javascript | 阅读： 4,890 次 |
1、SyntaxError SyntaxError是解析代码时发生的语法错误 // 变量名错误 var 1a; // 缺少括号 console.log 'hello'); 2、ReferenceError ReferenceError是引用一个不存在的变量时发生的错误。 unknownVariable // ReferenceError: unknownVariable is not defined 另一种触发场景是，将一个值分配给无法分配的对象，...阅读全文作者：cywcd | 分类：javascript | 阅读： 3,066 次 |
一、 PWA登场背景 很长时间以来我们对项目采用web app 还是 native app的选择上有一些不可调和的矛盾点，究其实质就是用户体验和性能成本问题。 Web App vs Native App 优缺点对比： 理想很美好，优点： 开发成本较低：使用web开发技术就可以轻松的完成web app的开发。 维护比较轻松：web app和一般的web一样，维护比较简单，它其实就是一个站点。 跨平台：一套代码实现a...阅读全文
最近做的在线竞答的项目需要使用websocket保持实时通讯，实现同步推题多用户在线竞答。在做过的过程中发现websocket断线频率较高，通过网上查询资料了解到nginx代理的websocket转发，无消息连接会出现超时断开问题。网上资料提到解决方案两种，一种是修改nginx配置信息，第二种是websocket发送心跳包。 下面就来总结一下本次项目中实践中解决的websocket的断线 和 重连 这两个问题的解...阅读全文作者：cywcd | 分类：javascript, web技术 | 阅读： 29,588 次 |
随着web技术的飞速发展，1999年制定的HTTP 1.1已经无法满足大家对性能的要求，Google推出协议SPDY，旨在解决HTTP 1.1中广为人知的性能问题。SPDY得到了Chrome、Firefox和Opera的支持，很多大型网站（如谷歌、Twitter、Facebook、淘宝）都对兼容客户端使用SPDY。SPDY在被行业采用并证明能够大幅提升性能之后，已经具备了成为一个标准的条件。 HTTP工作组采用了SPDY v2草案作为制定HTTP 2....阅读全文作者：cywcd | 分类：javascript, web技术 | 阅读： 3,855 次 |
handsontable是目前在前端界最接近excel的插件，可以执行编辑，复制粘贴，插入删除行列，排序等复杂操作。拥有jQuery、react、ng和vue版本，功能强大，是复杂表格的不二之选。 下面介绍一下handsontable表格控件在vue项目中的使用方法： 1.安装模块包 npm install @handsontable/vue --save npm install handsontable --save 这样安装完handsontable依赖的各模块（moment、...阅读全文作者：cywcd | 分类：javascript | 阅读： 7,892 次 |