在7月10日的微信公开课第七季上，微信小程序团队预告了小程序云的到来。目前官方已经公测：地址 。现在名为“小程序·云开发”。本文笔者将从一个开发者的角度去介绍及说下自己的体验。

许多站长是使用 LNMP 一键安装包来搭建在云主机的上的系统环境，本人的个人小站也是如此。最近在使用腾讯云的动态加速服务，而在这个 LNMP 环境下使用踩了点坑。所以在这里本文做记录下。

大约是上一年的这个时候，因为项目合并来到了新的项目组中。虽然协作的同岗位同事也是同一个组的，但使用的Gulp 工作流却有些不一样。第一天做项目需求的时候，就遇到了一件让我瞠目结舌的事情：这里的Sass 编译一次居然要10s 以上。 有用过Sass 这类CSS 预处理器都知道10s+ 意味着什么，你每保存一次.scss 文件，都必须等上10s 以上才能看到你所改动的效果。如此一来十分尴尬，因为你直接写原生的CSS 语法比这还快。让我更加惊讶的是当时的项目组相关同事已经用了这套工作流快一年了，却居然能一直默默忍

WeApp-Workflow 是Jeff 在开发个人微信小程序“DeveWork极客” 过程中积累总结而来的一个基于Gulp4 的，专门用于开发微信小程序的前端开发工作流。旨在通过自动化的方式解决微信小程序开发过程中写前端代码的痛点。 简介 进行微信小程序开发，必须用官方的“微信web 开发者工具”，但这个工具的编辑器功能跟专业的编辑器比起来就差强人意了。后来发现可以直接用 编辑器写代码 + “微信web 开发者工具”做预览功能 的组合方式进行开发，嗯开发舒适度好了点。 微信小程序自己搞了一套CSS 的轮子

本站WordPress +“微信小程序”实战系列文章已经到了第五篇，这次记录的是“DeveWork极客”小程序v2.0 的更新。2.0 版本在UI 上改动不大，但是“内核”却做了大改动——这些改动旨在提升小程序运行速度及降低性能消耗。 如果你没有看过本小程序，可以通过下面的小程序码进入体验。注意看文章的此时你扫码进入的版本可能不是2.0 版本了。 image.png 还是一样，如果你是第一次看本系列文章，建议先过目之前的文章： 《WordPress 网站基于REST API 开发“微信小程序”实战》 《W

本站微信小程序版“DeveWork极客”在中文WP 圈子可谓是一直被模仿，从未被超越。如今快速迭代，写作本文的现在是1.6 版本。作为“WordPress 开发微信小程序”系列的第四篇，记录的是v1.3 ~ v1.6 的开发要点。 如果你没有看过本小程序，可以通过下面的小程序码进入体验。注意看文章的此时你扫码进入的版本可能不是1.6 版本了。 ? 直接从v1.2 到v1.6 并不是我要做版本帝，确实迭代了这四个版本，也提交审核了四次，只不过有两次提交是为了修复严重的bug。本文的展开方式跟之前的稍微不一样。

本文是“WordPress 开发微信小程序”系列的第三篇，本文记录的是“DeveWork极客”小程序1.2 版本的开发要点。建议先看完第一篇、第二篇再来阅读本文。 如果你没有看过本小程序，可以通过下面的小程序码进入体验。注意看文章的此时你扫码进入的版本可能不是1.2 版本了。 ? “DeveWork极客”小程序v1.2 的更新内容主要集中在提升用户体验的优化点以及修复遗留bug。如同上一篇，本文除最后一章节，每个章节即为一个改动点，并参考微信小程序的开发者工具更新历史采用 A(Add)、F(Fix)、U(U

本文是“WordPress 开发微信小程序”系列的第二篇，本文记录的是开发“DeveWork极客”小程序v1.1 的过程。一如既往，目标读者为了解WordPress 的前端同学。建议先看完第一篇文章再来阅读本文。另外系列标题也去掉REST API 相关字段，改简单清晰点。 如果你没有看过本小程序，可以通过下面的小程序码进入体验。注意看文章的此时你扫描进入的版本可能不是不是1.1 版本了。 ? “DeveWork极客”小程序v1.1 的更新内容较多，这里摘取一些有意义的记录下。请注意本文内容展开方式与上一篇稍

微信小程序中提供了相关API 让开发者能获取到微信用户的相关信息，在首次去获取的时候会展示一个用户是否同意授权的对话框。Jeff 发现有不少线上的小程序都没有处理好用户“拒绝授权”导致的“授权失败”场景。 一个观点 私认为，开发微信小程序在用户授权上有一个要点：除非非常有必要，不要一进入小程序就申请授权，而是仅需要授权的页面才申请——这样让用户的心理负担没那么大。站在用户的角度，有时候我是很讨厌这种一进入小程序就申请授权的行为，毕竟头像昵称这些本质上还是属于用户的隐私，你小程序不给个理由就要拿去，我还是很反

几周前，Jeff 花了两天将自己的WordPress 网站做了个微信小程序版本。这篇文章主要记录自己在开发第一版的过程，顺便为有兴趣的你剖析如何将一个WordPress 网站借助 REST API 开发微信小程序版。本文目标受众为了解WordPress 且有初级前端知识的同学。 原理篇 WordPress 与 REST API WordPress 在4.4 版本后推出了 REST API， REST API 简单来说就是一种通过 HTTP 请求来获取、更新、删除数据的一种连接客户端与服务端的交互方式。我们访

postcss-lazysprite 是一个基于PostCSS 开发的用于生成雪碧图图片及其CSS 的插件，经过半年持续迭代，现已稳定用在旗下两款产品的Web 业务中。其与市面上的雪碧图插件不同在于生成雪碧图的“懒惰”姿势。 前言 前端界，伴随着雪碧图这个概念出现，自动化产生雪碧图这类工具就层出不穷。无论是早期GUI 工具，还是现在流行的配合Gulp/Grunt/Webpack 这类构建工具而产生的雪碧图插件。总之是百花齐放，长江后浪推前浪，后浪死在沙滩上。 根据输入方式的不同，现在市面上基于Node.js

前阵子为了满足工作上的一个需求开发了一个PostCSS 插件，后来也将这个插件提交给PostCSS 官方并得到认可。在这篇文章中笔者将记录开发过程中遇到的一些问题，且斗胆将之称为“最佳实践”，希望对有兴趣尝试PostCSS 插件开发的您有所帮助。 简介篇 开发成果展示 首先先上成果：https://github.com/Jeff2Ma/postcss-lazyimagecss （欢迎给个star 哦~） postcss-lazyimagecss 插件实现的功能是为 CSS 中的background-imag

WordPress 自4.7 版本后与时俱进推出了REST API，如此一来想象空间又扩展了许多，如今WordPress 可以完全作为后端数据驱动了。本文通过几个例子展示如何定制化输出WordPress REST API 的相关数据。 文章数据（posts）禁止某些字段显示 默认的，当请求类似 your-site.com/wp-json/wp/v2/posts?per_page=5&page=1 的接口来获取文章列表，展示的不少字段对一般人来说是没有必要。 ? 秉承“如无必要，勿增实体”的原则，减少请求时候

写 CSS 时候经常遇到要为弹窗浮层这些进行 class 命名的情况，之前对于Dialog, Modal, Popup, Flash，Tooltip等这类命名一直处于混用的情况。通过Quora 上的一个回答了解到了其中的区别，下面就按自己的理解说明下，更具体的区别可以直接看英文原文（文末链接）。如有疑问，欢迎留言探讨~ Alert 一般用于需要立即关注处理的警示信息（警示信息要言简意赅），一般伴有“确定”与“取消”的按钮。警示的窗体通常是前置在当前用户界面，使得用户不能忽视之而必须立即做出响应。 ? Mod

不知在看本文的你是否正处于如下情形：自带的Mac 设备（特指MacBook/Air/Pro 等苹果笔记本）在公司跟家里，因为使用的网络环境不同常常需要来回修改。就Jeff 本身来说，在公司的时候我会连接到公司的办公WiFi，打开内部通讯工具，Proxifier 等工作专用APP，甚至要将设备调成静音；而当我回到家连上家里的Wi-Fi，为了翻墙需要另外设置PAC 路径，同时关闭工作专用APP。第二天的上班下班再次重复同样的流程。 需要说明下，本文标题中的“网络环境”并不单单是指WiFi 的切换，更涵盖了切换网

个人在自己的MacBook Pro 笔记本上已经安装有了JetBrains 的几个IDE（如Webstorm、Pycharm），在作为公司工作机的iMac 上也安装了上述软件。那么我希望是能将两台Mac 上的同一个IDE 的配置保持同步。 文件的同步固然借助于Dropbox 可以实现，但另外需要对IDE 本身进行配置文件路径的重新定义。 以WebStorm 2016.2 为例， 默认的配置文件存储路径： /Users/jeffma/Library/Preferences/WebStorm2016.2/Use

postcss-lazyimagecss 是Jeff 基于gulp-lazyimagecss 开发的一个PostCSS 插件，实现的功能是在CSS 中自动添加width / height 属性。项目地址：https://github.com/Jeff2Ma/postcss-lazyimagecss （欢迎给个star！） 安装使用 npm install postcss-lazyimagecss --save-devnpm install postcss-lazyimagecss --save-dev 在G

以下内容来自于《众妙之门：JavaScript 与 jQuery 技术精粹》一书，为本人在阅读的时候感觉有必要记录的地方记录而来。 三重标记法 var d; if(x < 200){ d = 1; } else { d = -1; }   var d = x < 200 ? 1 : -1; 数组的遍历& 性能影响 /* cached outside loop*/ var len = myArray.length; for (var i = 0; i < len; i++) {}   /*

从五月份实习到现在快三个月了，这三个月的实习时段，按照leader 的要求，每天要写日总结发RTX 内部群，每周都要写周邮件群发整个部门——就这么坚持了三个月。个人不是很赞同写日总结也写周总结的做法，但实在是拗不过leader ，不过坚持下来也发现没那么难——虽然写周总结邮件常常词穷。 这篇文章其实是摘录之前写的周邮件的内容，记录的是实习做的项目遇到的一些bug 之类的。毕竟本站也鲜有更新，就拿过来凑成水文一篇吧。 1、-webkit-text-size-adjust 中的问题 在做游戏页面的时候，按照设

这篇文章是上一篇文章的延伸与总结，做的一个微信游戏宣传页上要调用长按识别二维码的功能，做的过程中遇到了两个坑，后来在组里分享会上分享了入坑经历，然后再度发现一个坑。本文就是在分享会上发言总结而成。 坑一：iOS 版微信长按识别二维码无法正常识别的bug （8.21 更新：最新版6.2.4 已经修复该bug） 以下实测在iOS 版（iPhone）微信6.2.2 中有此bug，安卓版微信暂时没有发现有此bug。建议看下面的内容前先看这篇文章。 “众所周知”，在一些使用在微信内置浏览器的页面上要调用其长按识别二维