SF
Jrain-前端玩具盆
Jrain-前端玩具盆
注册登录
关注博客
注册登录
主页
关于
RSS
70行python代码实现壁纸批量下载
jrainlau
2018-01-24
阅读 5 分钟
8.5k
好久没有写文章了,因为最近都在适应新的岗位,以及利用闲暇时间学习python。这篇文章是最近的一个python学习阶段性总结,开发了一个爬虫批量下载某壁纸网站的高清壁纸。
深入认识vue-cli:能做的不仅仅是初始化vue工程
jrainlau
2017-10-20
阅读 4 分钟
16.3k
相信对于大部分使用过VueJS的同学来说,vue-cli是他们非常熟悉的一个工具。借助vue-cli,我们通过非常简单的问答形式,方便地初始化一个vue工程,完全不需要担心繁复的webpack、eslint配置等等。
深入浅出基于“依赖收集”的响应式原理
jrainlau
2017-09-13
阅读 8 分钟
13.5k
每当问到VueJS响应式原理,大家可能都会脱口而出“Vue通过Object.defineProperty方法把data对象的全部属性转化成getter/setter,当属性被访问或修改时通知变化”。然而,其内部深层的响应式原理可能很多人都没有完全理解,网络上关于其响应式原理的文章质量也是参差不齐,大多是贴个代码加段注释了事。本文将会从一个非常...
使用offline-plugin搭配webpack轻松实现PWA
jrainlau
2017-08-15
阅读 6 分钟
22.2k
谈起PWA,许多人可能还只停留在“了解”的层面,比较少在实践中真正地尝试过,更多的仅仅是对着网上的教程和例子大概玩过。然而,网络上的例子多是简单的demo,鲜有与真正的开发相结合,例如和webpack的工程化结合。这篇文章将会从一个webpack plugin出发,谈一谈如何使用这个名为offline-plugin的webpack插件轻松实现PWA。
组件化开发与黑箱
jrainlau
2017-07-28
阅读 3 分钟
7.3k
在如今的前端开发中,“组件化”已经成为了一种流行,随之而来的各种开发框架更是把这一概念发扬光大。但是概念归概念,真正的“组件化”实践还是有许多值得探讨的地方,其中“黑箱”是我认为最具有代表性的实践方式。今天就让我们抛开具体的框架,直接来谈一谈“组件化开发”与“黑箱”。
在项目实践中用更优雅的方式处理数组问题
jrainlau
2017-06-27
阅读 3 分钟
4.3k
在最近的项目中,遇到了比较多处理数组的场景,比如要对数组里面某个元素的某一个字段进行抽取归类,或者判断数组当中的某个元素是否符满足判断条件等。
【工程化】从0搭建VueJS移动端组件库开发框架
jrainlau
2017-06-05
阅读 13 分钟
8.6k
最近参与维护公司内部的一个针对移动端的UI组件库,该组件库缺乏文档和严格的文件组织结构。Vue-Donut的功能比较简单,并不能方便地创建针对移动端UI组件库的文档和预览。在参考了mint-ui等业界内成熟的方案之后,我在Vue-Donut的基础上进行了拓展,最后搭建出了一个非常方便且自动化的开发框架。
好用的项目初始化工具SCION升级啦!
jrainlau
2017-05-11
阅读 3 分钟
6.8k
SCION是一个专门用于初始化项目的工具。只要你有一套模板,就能通过SCION方便地把项目初始化出来。同时SCION允许你添加多套模板,大大提升了工作效率。
Vue-Donut——专用于构建Vue的UI组件库的开发框架
jrainlau
2017-05-04
阅读 2 分钟
9.3k
相信不少使用Vue的开发者和公司都有定制一套属于自己的UI组件库的需求。但是要开发、测试、打包、发布这个组件库,却需要耗费较大的劳动力去搭建一整套的环境。针对这个问题,我搭建了一个专门用来构建Vue的UI组件库的开发框架,以节省搭建环境的劳动力,专心于组件库的开发。
用现代化的方式开发一个图片上传工具
jrainlau
2017-04-18
阅读 10 分钟
6.4k
对于图片上传,大家一定不陌生。最近工作中遇到了关于图片上传的内容,借此机会认真研究了一番,遂一发不可收拾,最后琢磨了一个东西出来。在开发的过程中有不少的体会,于是打算写一篇文章分享一下心得体会。本文将会以这个名为Dolu的项目为例子,一步步介绍我是如何进行环境搭建、代码设计以及实际开发的。内容较多,...
提升用户体验的利器——使用Vue-Occupy实现占位效果
jrainlau
2017-02-28
阅读 2 分钟
10.1k
项目地址:[链接]DEMO:[链接] 介绍 Vue-Occupy是一个vue指令,能够在数据被加载之前使用一个可配置的色块进行占位,能够有效提升用户体验。 安装 使用yarn或者npm的方式进行安装: {代码...} 使用 进入项目入口文件,添加以下代码: {代码...} 这样,vue-occupy已经被注册为一个全局的指令,你可以在任意.vue文件里面通...
谈一谈几种处理JavaScript异步操作的办法
jrainlau
2017-02-26
阅读 4 分钟
12.3k
js的异步操作,已经是一个老生常谈的话题,关于这个话题的文章随便google一下都可以看到一大堆。那么为什么我还要写这篇东西呢?在最近的工作中,为了编写一套相对比较复杂的插件,需要处理各种各样的异步操作。但是为了体积和兼容性,不打算引入任何的pollyfill,甚至连babel也不允许使用,这也意味着只能以es5的方式去...
《高性能JavaScript》读书笔记
jrainlau
2017-02-15
阅读 3 分钟
10.4k
入手《高性能JavaScript》一周后,终于断断续续看完了。简要说说感受,就是这本书非常薄,非常容易看,认真看的话其实两三个小时就能翻一遍了。这篇文章也是作为一篇阅读笔记,用来记录我在阅读过程中的一些理解与感悟。
深入NUXT,看看一条命令行的背后到底发生了什么
jrainlau
2017-01-13
阅读 3 分钟
34.1k
随着react社区的next.js框架的发布,vue社区也终于诞生了属于自己的前后端同构框架nuxt.js。在进一步的接触与使用中,发现nuxt.js确实极大地方便了vue项目的开发,其背后的逻辑也值得我们玩味。关于nuxt的具体的用法请查阅官方文档,本文就不一一赘述了。
我的2016:从野路子到正规军的前端养成记
jrainlau
2016-12-27
阅读 4 分钟
13.5k
在今年年初的时候,正式从实习了半年的单位离职。在这半年的实习时间内,负责的是公司电商系统的前端页面开发,第一次接触了VueJS这个框架。当时整个公司加上我只有2个前端工程师,要做的网站却是功能复杂,需求更改频繁,重构也是家常便饭。随着系统复杂度的提升,原有的架构已经不能满足,经过和老大的沟通,最终敲定...
VUWE——又一个移动端Vue2组件库
jrainlau
2016-12-27
阅读 1 分钟
15.1k
VUWE 在线预览 介绍 VUWE是一款基于微信WeUI所开发的,专用于Vue2的组件库。 它与WeUI完全解耦。用户通过自定义WeUI的样式文件,可以方便地对VUWE实现定制化。 中文文档 使用 进入一个Vue工程项目,然后执行以下命令: {代码...} 加载WeUI 在开始之前,需要在index.html内加载WeUI样式库: {代码...} 全局引入 进入工程...
使用ES6的新特性Proxy来实现一个数据绑定实例
jrainlau
2016-11-10
阅读 7 分钟
13.8k
作为一个前端开发者,曾踩了太多的“数据绑定”的坑。在早些时候,都是通过jQuery之类的工具手动完成这些功能,但是当数据量非常大的时候,这些手动的工作让我非常痛苦。直到使用了VueJS,这些痛苦才得以终结。
深入研究:HTTP2 的真正性能到底如何
jrainlau
2016-10-19
阅读 10 分钟
35.3k
HTTP2的概念提出已经有相当长一段时间了,而网上关于关于http2的文章也一搜一大把。但是从搜索的结果来看,现有的文章多是偏向于对http2的介绍,鲜有真正从数据上具体分析的。这篇文章正是出于填补这块空缺内容的目的,通过一系列的实验以及数据分析,对http2的性能进行深入研究。当然,由于本人技术有限,实验所使用的...
Markcook2.0,使用Vue2.0和Vuex2.0进行完全重构升级
jrainlau
2016-10-02
阅读 3 分钟
16.5k
随着Vue2.0的正式推出,我也正好籍此机会对我的开源项目Markcook进行重构。这一次重构既打发了我在高速路上堵车的无聊时光,又加深了对Vue2.0和Vuex2.0使用的认识,可谓一举多得。
谈谈JS中的函数劫持
jrainlau
2016-09-21
阅读 2 分钟
20.2k
说到劫持,第一反应可能是什么不好的东西。函数劫持并不邪恶,关键是看使用的人。虽然这个概念在前端领域使用较少,但是在安全领域、自定义业务等场景下还是有一定的使用价值的。所以,这一篇文章将会和大家一起去了解一下JS中的函数劫持是什么,有什么用。
SphinxJS——把字符串编码成png图片的超轻量级开源库
jrainlau
2016-09-13
阅读 2 分钟
12k
体验地址:[链接]项目地址:[链接] SphinxJS 一个能够把字符串编码成png图片,或者从png图片中解码出字符串的超轻量级开源库,总代码数甚至不超过100行! 使用方法 通过npm安装 {代码...} 通过<script></script>标签引入 {代码...} 值得注意的是,因为SphinxJS使用了ES2015的Promise以及其他很棒的特性,这...
探索前端黑科技——通过 png 图的 rgba 值缓存数据
jrainlau
2016-09-09
阅读 5 分钟
10.5k
说起前端缓存,大部分人想到的无非是几个常规的方案,比如cookie,localStorage,sessionStorage,或者加上indexedDB和webSQL,以及manifest离线缓存。除此之外,到底还有没有别的方法可以进行前端的数据缓存呢?这篇文章将会带你一起来探索,如何一步一步地通过png图的rgba值来缓存数据的黑科技之旅。
基于 PhantomJS + Node + Express + VueJS 1.x 的服务端渲染实践
jrainlau
2016-08-23
阅读 6 分钟
14.4k
随着Vue 2.0的发布,服务端渲染一度成为了它的热卖点。在此之前,单页应用的首屏加载时长和SEO的问题,一直困扰着开发者们,也在一定程度上制约着前端框架的使用场景。React提出的服务端渲染方案,较好得解决了上述两个痛点,受到了开发者的青睐,但也因此多了一个抨击Vue的理由——Vue没有服务端渲染。为了解决这个问题,...
教你从零开始搭建一款前端脚手架工具
jrainlau
2016-08-06
阅读 7 分钟
63.4k
在实际的开发过程中,从零开始建立项目的结构是一件让人头疼的事情,所以各种各样的脚手架工具应运而生。笔者使用较多的yoeman,express-generator和vue-cli便是当中之一。它们功能丰富,但最核心的功能都是能够快速搭建一个完整的项目的结构,开发者只需要在生成的项目结构的基础上进行开发即可,非常简单高效。
【译】关于Webpack中一些让人困惑的地方的解答
jrainlau
2016-08-03
阅读 7 分钟
12k
Webpack是React和Redux项目的主要模块加载器。我认为使用Angular2和其他的框架的人在如今也大量使用Webpack进行开发。
MottoJS,一个让你的“座右铭”更好玩的JS插件
jrainlau
2016-07-23
阅读 2 分钟
7.2k
项目地址:[链接]体验地址:[链接]Codepen: Codepen 最新更新:1.0.1版本加入了“抖动特效”,类似信号被干扰的样子,欢迎品尝~ 七夕快到了,我不会告诉你这是一个告白神器……写一封长长的告白信,把config里面的时间设置得长一些,然后默默地把它发给你的心上人…… 介绍 MottoJS是一个只有4kb(.min文件只有2kb)的JS插件,...
深析filemap.js——关于JS的算法及优化的实践
jrainlau
2016-07-17
阅读 6 分钟
4.5k
关于项目的用法和介绍可以查看上面的两个链接,这篇文章主要内容是对filemap.js的代码进行一步一步的分析,详细介绍其运行原理和优化策略。
Vue-Cleave - 在Vue中使用CleaveJS格式化你的输入内容
jrainlau
2016-07-16
阅读 2 分钟
7.6k
项目地址:[链接] What's CleaveJS? CleaveJS是最近github上的一个热门项目,在短短的一个多月中star数达到了2500+,且保持着强劲的上升势头。它的主要目的是 Format input text content when you are typing格式化你的输入内容 可以查看官方的在线DEMO进行体验。 Vue-Cleave 官方的CleaveJS只提供了原生JS和ReactJS版本...
自动化文件目录结构生成工具——filemap.js
jrainlau
2016-07-14
阅读 1 分钟
10.8k
作为一个经常写博客的人,在介绍自己的项目的时候往往需要介绍文件目录结构。在以往的情况下,要么一行一行手动码字输入,要么简单粗暴地截图,都无法方便快速地构造一个文件目录结构图出来。后来在学习算法的时候,发现文件目录结构跟树的概念非常像,于是便萌生出制作一个自动化文件目录结构生成工具出来。
[译] Houdini:也许是你未曾听过的最振奋人心的 CSS 进化
jrainlau
2016-07-05
阅读 7 分钟
8.6k
你是否曾经想要使用一些特别的CSS特性,却因为未曾得到所有浏览器的支持而选择放弃?又或者是,这些特性得到了所有浏览器的支持,但总会伴随着奇怪的bug,表现不一致甚至相互矛盾?如果这些事情都曾发生在你身上——我敢打赌——你应该关注一下Houdini。
1
2
(current)
3
下一页
上一页
2
(current)
下一页