自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

  • 博客(22)
  • 收藏
  • 关注

转载 小技巧系列

js 常用工具函数功能类复制内容至剪贴板主要考虑点: readonly 解决在 iphonex 上会弹出键盘问题, select 执行两个兼容安卓和 iosfunction copyToClipboard (str) { const a = document.createElement('textarea') a.value = String(str) a.style...

2019-08-20 15:01:00 151

转载 PWA 推送实践

PWA 推送实践最近公司内录任务的系统总是忘记录任务,而那个系统又没有通知,所以想要实现一个浏览器的通知功能,免得自己忘记录入任务。前端实现通知的几种方式想要实现通知,我们就需要有个客户端,对于前端同学来说,我们的客户端就是浏览器,我们每天基本上都是长开浏览器,所以用浏览器做个通知效果更好。既然是浏览器,在PWA 出现之前我们就只有 chrome 插件可以用,现在既然有了 PWA,...

2019-05-06 16:18:00 662

转载 前端知识笔记 - 性能

前端知识笔记 - 性能本文章总结 https://github.com/thedaviddias/Front-End-Checklist内部,非原创性内容。最佳实践全局目标第一幅有意义的绘图在 1s 内对于平均配置交互时间应该小于 5s (平均配置批 200$ 内的安卓设备在慢 3G 网络 400ms RTT 和 400kpbs 的传输速度)严格限制文件大小在 170kb...

2019-02-22 18:17:00 243

转载 前端知识笔记 - 安全

前端知识笔记 - 安全本文章总结 https://github.com/thedaviddias/Front-End-Checklist内部,非原创性内容。https尽量使用 Https,个人网站可使用 Let's Encrypt使用 Strict-Transport-Security 返回头。解决的问题是https://www.owasp.org/index.php/HTT...

2019-02-15 14:39:00 327

转载 Vue 组件设计

Vue 组件设计Vue 作为 MVVM 框架一员,不管是写业务还是基础服务,都少不了书写组件。本文总结一下书写业务组件的一些心得。为什么要写组件?我们知道,只要是组件,就需要在引用的时候与 view 或者其他组件进行相关的交互,即 props 传值,$emit 触发事件,使用 $refs 调用组件方法等,与写在同一个文件相比,耗费的精力明显更多。那为什么需要拆分出组件呢?我认为有...

2019-01-24 14:44:00 245

转载 使用 puppeteer 创建一个自动化导出 PDF 的服务

最近在基于 RAP2 做内网的一个 API 管理平台,涉及到与外部人员进行协议交换,需要提供 PDF 文档。在设置完成 CSS 后已经可以使用浏览器的打印功能实现导出 PDF,但全手动,总是觉得不爽,所以尝试使用了 PUPPETEER 实现 PDF 自动生成。PUPPETEER 功能介绍puppeteer 是 chrome 提供的一个无头浏览器,它是替代 phantomjs 的一...

2018-09-19 11:52:00 675

转载 解决浏览器缓存导致页面非最新的小技巧

解决浏览器缓存导致页面非最新的小技巧为了保证页面访问性能最佳,我们通常在服务端会设置缓存策略,比如说带有 hash 类型的文件会设置过期时间为永久,非 hash 文件比如 html 等其他文件设置了通用的缓存策略,即:根据 etag 或者 last-modified 来判断文件是否更改,然后返回 304 代码告知浏览器不用下载,从而保证页面最新。这些策略在页面加载性能和版本维持最新...

2018-09-06 11:49:00 393

转载 浏览器文件上传浅淡

浏览器文件上传浅淡form 表单的各种格式在出现 ajax 之前,前端是使用 form 表单进行提交数据的,它的结构大概是这样:<form> <input type="text" name="username"/> <button type="submit">提交</button></form>在 form 表...

2018-05-17 20:01:00 79

转载 Vue 项目代理设置的优化

Vue 项目代理设置的优化Vue 类的项目开发中项目结构基本都是类似于 Vue-cli 生成的方式,这种方式开发中,最常用到的模式是开启代理进行 mock 调试或远程调试,也就是使用了 Vue-cli 设置的配置 proxyTable 或者直接使用 Webpack-dev-server提供的 proxy 选项。它是采用了 http-proxy 库,所以具体配置可查看:https...

2018-04-16 16:58:00 167

转载 npm 安装私有 git 包

npm 安装私有 git 包npm 对于前端开发来说是一种必备的工具,对于开源项目来说,完全没有任何问题,安装包的依赖直接依赖于 Npm 即可。对于公司内网的一些项目就不是太方便了,因为我们通常会有这样的项目结构:对于 npm 公用包来说是比较方便的,直接引用即可。而内网的代码应该怎么引入呢?大概有以下几种方式:npm 公有包npm 私有包搭建 npm 私有服务器git...

2018-03-21 14:03:00 1415

转载 Weex 初探

Weex 初探Weex 介绍Weex 是阿里于 2016 年开源的一款开发框架,它的介绍是:Weex 是一个使用 Web 开发体验来开发高性能原生应用的框架。它使用了 Web 技术来开发 Android、IOS 应用,从而达到更快的迭代速度,同时降低了开发原生应用的门槛,达到生产力和性能共存。Weex 项目结构Weex 设计之初是为了和原有应用进行兼容开发,和 Nati...

2018-03-12 16:30:00 140

转载 使用Vue和thrift建立前后端交互的demo

初识thriftthrift 是 facebook 于2007年开发的一款跨平台 RPC(Remote Procedure Call) 软件框架,它可以在多种平台上进行无缝交互,数据传输使用二进制的方式,比XML和JSON体积更小,适合于内网的之间的数据进行交互。thrift 结构(参见https://www.ibm.com/developerworks/cn/java/j-lo...

2018-03-02 18:09:00 807

转载 利用mock提高效率

利用mock提高效率谈到mock,就不得不讲前后端分离。理想情况下前后端不分离,由全栈的人以product和infrastructure的维度进行开发,效率是最高的。近些年来业务的复杂度越来越高,真正的全栈人才极为难招,企业只能退而求其次,对开发进行分工细化,让每个人做自己最擅长的事,前端负责UI显示和交互,后端负责业务的逻辑、性能等,从而架构上达到更高的效率。同时由于分工的细化,导致...

2018-03-01 10:48:00 291

转载 作用域链与闭包

  读了这篇博文地址后,对作用域和闭包终于有一了些了解。之前看各种文章,让我以为闭包是因为内部引用变量,导致变量无法在外部访问,而通过内部函数可以被外部访问导致被引用的变量可以间接访问。现在看来,这只能说是闭包的一种外在表现,跟闭包本身没有任何关系的(在You don't know JS中理解与本文不一致,书中认为闭包实际上是作用域,由于内部函数引用导致外部函数在栈中移出后其作用域仍可被...

2017-12-15 17:35:00 106

转载 lasy load图片的实现

无意中看到了这篇关于使用LQIP(Low Quality Image Placeholders) 原文链接,方案实现图片加载优化方案。在此实践一把。1. 方案实现页面初始化时,img元素初始化时,src使用低质量的图片,显示出图片的大概轮廓页面滚动到当前图片位置,后台启动加载原图原图加载完成,替换掉之前的src显示出原图监听页面是否滚动到图片位置使用的Inte...

2017-12-12 10:37:00 99

转载 利用fiddler和mock调试本地微信网页

利用fiddler和mock调试本地微信网页 微信公众号网页是比较特殊的页面,普通页面直接打开即可访问,但对于需要请求微信相关接口的部分需要安全域名认证。这导致了使用mock数据进行开发的页面没办法走完整个流程,还是需要把代码发布到服务器上才可以测试。而发布服务器的速度总是要时间的,每次修改都发布服务器耗时较长,大大延长了开发时间。使用一种本地开发的技术就比较重要了...

2017-11-28 09:28:00 158

转载 nodejs中http-proxy使用小结

最近在写xmocker的工具,用于开发前期的mock数据,不可避免的用到了代理的中间件。当然,github上有关于http-proxy封装的中间件。毕竟是自己练手的项目,就自己写了个中间件,方便定制功能。 http-proxy库用于koa中,是使用它的 proxy.web方法。常规的用法是:proxy.web(req, res, { target: 'http:...

2017-09-30 09:56:00 554

转载 使用nodejs搭建api的mock服务

1. 介绍   公司的业务开发都是静态页面,开发前期总是避免不了获取api的问题。在vue中有一些mockjs的方案,方案都是注入性质的,和最终部署总是有差别,而且业务大部分还在zepto下,很难找到合适的方案。而开发前期调整css样式需要真实的dom,不能总是写个静态页面来调试。正好利用koa2的便利性,搭建一个mock服务。 在线的mock服务其实还是...

2017-08-22 11:50:00 254

转载 安卓4.0下rem显示不正常的问题

在项目中使用了rem为单位,结果在Oppo和4.0下某些浏览器rem工作不正常,font-size计算出来的px总是大于预期的值,因此加了个Hackvar docEl = doc.documentElement, resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize', reca...

2016-11-23 11:39:00 140

转载 js中隐式类型转换测试

javascript数据类型:使用typeof可以返回的数据类型有六种"number" , "string" , "boolean" , "object" , "function", "symbol" 和 "undefined"注:typeof在检测let定义的变量时如果当前状态还未定义变量会报错,不再可靠number常见的类型包括:  Infinity 表示无穷大...

2016-11-07 13:53:00 72

转载 webpack使用webpack-dev-middleware进行热重载

新手,刚开始学习webpack,想使用webdevserver,但定制性太差,于是研究了一下使用webpack-dev-middleware进行指定。根据文档https://www.npmjs.com/package/webpack-hot-middleware需要配置entry和output.常规配置entry: ['./src/main.js'], output: ...

2016-10-28 16:27:00 231

转载 网页打包安卓APP流程

搭建环境过程:1. 安装JDK。 参见http://www.cnblogs.com/Li-Cheng/p/4334985.html。 注:实质上到该网址上下载好JDK安装包,安装后添加一个环境变量:JAVA_HOME,其值为:C:\Program Files\Java\jdk1.8.0_73(由于安装路径不同,从路径下复制即可),然后在PATH变量...

2016-07-04 13:06:00 189

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除