之前系统接入大数据PV统计平台，最近因PV统计平台侧服务器资源紧张，要求各接入方必须缓存API调用验证用的Token，从而减少无效请求和服务端缓存中间件的存储压力。虽然系统部分业务模块都有缓存数据的需求，但由于没有提供统一的前端缓存模块，这导致各业务模块都自行实现一套刚好能用的缓存机制，甚至还会导致内存泄漏...

前几个月和隔壁组的老王闲聊，他说项目的供应商离职率居高不下，最近还有开发刚接手ESB订阅发布接口才两周就提出离职，而他能做的就只有苦笑和默默地接过这个烂摊子了。而然幸福的家庭总是相似的，而不幸的我却因业务变革走上了和老王一样的道路。单单是接口的开发居然能迫使一位开发毅然决然地离职，我既不相信是人性的...

由于Oracle并没有向公开Maven仓库提供任何Oracle JDBC Driver的Jar包，因此我们无法像MySQL、SQLite等那么轻松直接通过Maven加载依赖。而手动下载Oracle JDBC Driver Jar包，然后安装到本地仓库(.m2目录)，再通过Maven加载依赖则是常用手段。但此外我们还能通过<scope>system</scope>的方式引入，但其中的坑...

江湖有传“动态类型一时爽，代码重构火葬场”，由于动态类型语言在开发时不受数据类型的约束，因此非常适合在项目原型阶段和初期进行快速迭代开发使用，这意味着项目未来将通过重写而非重构的方式进入成熟阶段。而在企业级应用开发中，每个系统特性其实都是需求分析人员与用户进行多次调研后明确下来的，后期需要重写的可...

也许前端的同学会问JavaScript从诞生至今都没有枚举类型，我们不是都活得挺好的吗？为什么TypeScript需要引入枚举类型呢？也许被迫写前端的后端同学会问，TypeScript的枚举类型是和Java/.NET的一样吗？下面我们来一起探讨和尝试解答吧！

在CSS魔法堂：改变单选框颜色就这么吹毛求疵！中我们要模拟原生单选框通过Tab键获得焦点的效果，这里涉及到一个常常被忽略的属性——outline，由于之前对其印象确实有些模糊，于是本文打算对其进行稍微深入的研究^_^

是否曾经被业务提出"能改改这个单选框的颜色吧！让它和主题颜色搭配一下吧！"，然后苦于原生不支持换颜色，最后被迫自己手撸一个凑合使用。若抛开input[type=radio]重新开发一个，发现要模拟选中、未选中、不可用等状态很繁琐，而涉及单选框组就更烦人了，其实我们可以通过label、::before、:checked和tabindex，然后外...

还记得面试时被问起"请说说display:none和visibility:hidden的区别"吗？是不是回答完display:none不占用原来的位置，而visibility:hidden保留原来的位置后，面试官就会心一笑呢？其实不止那么简单呢！本文我们将一起深究它俩的恩怨情仇，下次面试时我们可以回答得更出彩！

继上篇《CSS魔法堂：稍稍深入伪类选择器》记录完伪类后，我自然而然要向伪元素伸出“魔掌”的啦^_^。本文讲讲述伪元素以及功能强大的Contet属性，让我们可以通过伪元素更好地实现更多的可能！

过去零零星星地了解和使用:link、::after和content等伪类、伪元素选择器，最近看书时发现这方面有所欠缺，于是决定稍微深入学习一下，以下为伪类部分的整理。

在《CSS魔法堂：Transition就这么好玩》中我们了解到对于简单的补间动画，我们可以通过transition实现。那到底多简单的动画适合用transtion来实现呢？答案就是——我们只需定义动画起始和结束帧的状态的动画。一旦关键帧数大于2时，我们必须转向CSS Animation了。本文为这段时间学习的记录，欢迎拍砖。

以前说起前端动画必须使用JS，而CSS3为我们带来transition和@keyframes，让我们可以以更简单（声明式代替命令式）和更高效的方式实现UI状态间的补间动画。本文为近期对Transition的学习总结，欢迎各位拍砖。

Flex是Flexible Box的缩写，就是「弹性布局」。从2012年已经面世，但由于工作环境的原因一直没有详细了解。最近工作忙到头晕脑胀，是要学点新东西刺激一下大脑，打打鸡血。

前言  最近在用Polymer封装纯数字的输入框，开发过程中发现不是坑，也有不少值得研究的地方。本系列打算分4篇来叙述这段可歌可泣的踩坑经历： [《动手写个数字输入框1：input[type=number]的遗憾》]([链接] 《动手写个数字输入框2：起手式——拦截非法字符》 《动手写个数字输入框3：痛点——输入法是个魔鬼》 《动手写个数...

前言  最近在用Polymer封装纯数字的输入框，开发过程中发现不是坑，也有不少值得研究的地方。本系列打算分4篇来叙述这段可歌可泣的踩坑经历： 《动手写个数字输入框1：input[type=number]的遗憾》 《动手写个数字输入框2：起手式——拦截非法字符》 《动手写个数字输入框3：痛点——输入法是个魔鬼》 《动手写个数字输入框4...

前言  最近在用Polymer封装纯数字的输入框，开发过程中发现不少坑，也有很多值得研究的地方。本系列打算分4篇来叙述这段可歌可泣的踩坑经历： 《动手写个数字输入框1：input[type=number]的遗憾》 《动手写个数字输入框2：起手式——拦截非法字符》 《动手写个数字输入框3：痛点——输入法是个魔鬼》 《动手写个数字输入框4...

前几天用户反映在录入资料时一不小心错按Backspace键，就会直接回退到是一个页面，导致之前辛辛苦苦录入的资料全部丢失了。哦？居然还有这种情况。下面我们来一起探讨一下吧！

对于问题多多的IE678，FOUC(flash of unstyled content)——浏览器样式闪烁是一个不可忽视的话题，但对于ever green的浏览器就不用理会了吗？下面尝试较全面地解密FOUC。

上周5在公司作了关于JS异步编程模型的技术分享，可能是内容太干的缘故吧，最后从大家的表情看出“这条粉肠到底在说啥？”的结果:(下面是PPT的讲义，具体的PPT和示例代码在[链接]上，有兴趣就上去看看吧！

虽然tmux能让我们方便组织工作环境，但每次重新打开会话时都需要手动重新创建窗口、窗格和执行各种程序，能不能像VS那样以工程为单位保存窗口、窗格和各种所需执行的程序的信息呢？tmuxinator恰恰能解决我们这个需求！

鉴于BASH及其周边强大的工具以及VIM高效快捷，加上现在我工作重心转移到前端开发上，因此我华丽地转向Linux阵营(当然从最傻瓜式的Ubuntu开始啦!)。但BASH和VIM默认样式确实颜值太低，功能强大固然重要，但在这看脸的时代谁不爱美呢？那么我们先拿状态栏来开刀吧，而刀就是强大酷炫的Powerline本尊了。

Ubuntu 16+中$ sudo apt install vim所安装的vim只支持Python3，但很多插件如YCM和powerline均需要Python2，那就来场“生命贵在折腾”吧！

说起Custom Element那必然会想起那个相似而又以失败告终的HTML Component。HTML Component是在IE5开始引入的新技术，用于对原生元素作功能"增强"，虽然仅仅被IE所支持，虽然IE10也开始放弃它了，虽然掌握了也用不上，但还是不影响我们以研究的心态去了解它的:)

通过《WebComponent魔法堂:深究Custom Element 之 面向痛点编程》，我们明白到其实Custom Element并不是什么新东西，我们甚至可以在IE5.5上定义自己的alert元素。但这种简单粗暴的自定义元素并不是我们需要的，我们需要的是具有以下特点的自定义元素：

最近加入到新项目组负责前端技术预研和选型，一直偏向于以Polymer为代表的WebComponent技术线，于是查阅各类资料想说服老大向这方面靠，最后得到的结果是:"资料99%是英语无所谓，最重要是UI/UX上符合要求，技术的事你说了算。"，于是我只好乖乖地去学UI/UX设计的事，木有设计师撑腰的前端是苦逼的:(嘈吐一地后，还是挤点...

最近加入到新项目组负责前端技术预研和选型，其中涉及到一个熟悉又陌生的需求——国际化＆本地化。熟悉的是之前的项目也玩过，陌生的是之前的实现仅仅停留在"有"的阶段而已。趁着这个机会好好学习整理一下，为后面的技术选型做准备。 本篇作为系列的最后一篇，打算和大家一起看看HTTP的Content Negotiation机制和更多关于...

最近加入到新项目组负责前端技术预研和选型，其中涉及到一个熟悉又陌生的需求——国际化＆本地化。熟悉的是之前的项目也玩过，陌生的是之前的实现仅仅停留在"有"的阶段而已。趁着这个机会好好学习整理一下，为后面的技术选型做准备。 本篇将于大家一起挽起袖子撸代码:)

最近加入到新项目组负责前端技术预研和选型，其中涉及到一个熟悉又陌生的需求——国际化＆本地化。熟悉的是之前的项目也玩过，陌生的是之前的实现仅仅停留在"有"的阶段而已。趁着这个机会好好学习整理一下，为后面的技术选型做准备。 本篇将阐述国际化和本地化的概念，以及其中一个很重要的概念——Language tag(也叫Languag...

最近实施的同事报障，说用户审批流程后直接关闭浏览器，操作十余次后系统就报用户会话数超过上限，咨询4A同事后得知登陆后需要显式调用登出API才能清理4A端，否则必然会超出会话上限。 即使在页面上增添一个登出按钮也无法保证用户不会直接关掉浏览器，更何况用户已经习惯这样做，增加功能好弄，改变习惯却难啊。这时想...

前言 说起box-shadow那第一个想法当然就是用来实现阴影，其实它还能用于实现其他好玩的效果的，本篇就打算说说box-shadow的那些事。 二话不说看效果 3D小球 {代码...} 纸张阴影(来自@张鑫旭老师) {代码...} 细读属性 看到上面这么绚丽的效果，是不是迫不及待想弄清box-shadow呢？下面我们来一步步解密它吧！ 概述属性语...