随笔分类 - 前端开发
模块加载器
摘要：最近在做新项目的时候自己利用一点业余时间写了一个简单的js模块加载器。后来因为用了webpack就没有考虑把它放到项目里面去，也没有继续更新它了。模块加载器开源的有很多，一般来说seaJS和reqiureJS都能满足基本需求。本篇博文主要分享一下卤煮写这个加载器的一些想法和思路，作为学习的记录。 j 阅读全文
Backbone源码解析（六）：观察者模式应用
摘要：卤煮在大概一年前写过backbone的源码分析，里面讲的是对一些backbone框架的方法的讲解。这几天重新看了几遍backbone的源码，才发现之前对于它的理解不够深入，只关注了它的一些部分的细节和实现技巧。忽略了它的设计思想，而卤煮认为，一套库或者框架最值得借鉴的地方正好是它的设计思想。也巧，最 阅读全文
NodeJs 开发微信公众号（五）真实环境部署
摘要：在测试环境下开发完成代表着你离正式上线的目标不远了。接下来本章就主要谈一谈把测试环境的公众号升级为正式的公众号。 服务器和域名 目前为止我们只是在自己的电脑上完成了测试环境。真实的线上环境当然需要自己购买服务器和域名了。卤煮买的是阿里云的ecs云服务器，配置是单核1G内存，硬盘是40g。对于卤煮这样 阅读全文
NodeJs 开发微信公众号（四）微信网页授权
摘要：微信的网页授权指的是在微信公众号中访问第三方网页时获取用户地理、个人等信息的权限。对于开发了自己的网页app应用时，获取个人的信息非常重要。上篇博客讲到了注册时可以获取用户的信息，很多人会问为什么还需要网页授权这种方式去获取呢，直接从数据库中读取不就可以了吗？这样的做的原因是服务器会话时间终究是有限 阅读全文
NodeJs 开发微信公众号（三）微信事件交互
摘要：微信公众号有个规则，一旦开启了开发者模式，其他的常规功能就都必须通过接口调用完成。比如说自定义菜单功能，必须通过发送post请求的方式生成。本章就通过关注到取消关注的整个过程来谈一谈nodejs是怎么样与微信交互的。这些功能的入口就是你在测试公众号里面填写的URL（以下用/login/wechat代 阅读全文
NodeJs 开发微信公众号（二）测试环境部署
摘要：由于卤煮本人是做前端开发的，所以在做公众号过程中基本上没有遇到前端问题，在这方面花的时间是最少的。加上用了mui框架（纯css界面）和自己积累的代码，很快地开发出了界面来。接着是后台开发。卤煮选的是nodejs，作为中小型的项目开发，nodejs是前端开发人员的首选。然后是选了一些开发包，帮助快速上 阅读全文
NodeJs 开发微信公众号（一）准备工作
摘要：前言 大概是一个月前，自己用业余时间做了一个微信公众号。微信开发，尤其是对后台不熟悉的人来说显得尤其困难。首先要克服的是后台语言（nodejs）的一些不熟悉困难，其次，也是最大的一点困难是在跟微信交互过程。借助各种工具和几位朋友的帮助，总算把各种困难解决，并且在自己计划的时间内建立起来公众号。第一次 阅读全文
Css 动画的回调
摘要：在做项目中经常会遇到使用动画的情况。以前的情况是用js写动画，利用setTimeout函数或者window.requestAnimationFrame()实现目标元素的动画效果。虽然后者解决了刷新频率和移动频率同步的问题，但是因为js频繁地操作dom带来的额外开销和复杂的计算公式使得大多数开发者对用... 阅读全文
GIT常用命令笔记
摘要：最近在做了一个自己的项目。两个人合作的，所以需要用到版本管理工具。本来打算学一下自己搭建svn的，后来朋友推荐我用git，免费，流行，好用，逼格。所以就学习了一下。发现这个git与已经使用惯了的svn真是有点不一样。在学习中自己也做了一些记录，大概概括了几本常用命令。在这里贴出来，也希望更多人去积极... 阅读全文
论如何在手机端web前端实现自定义原生控件的样式
摘要：手机开发webapp的同学一定遇到过这样问题，如何为丑极了的手机元素应用自定义的样式。首先，要弄清楚为什么要定义手机原生控件的样式，就需要看看手机的那些原生框样式的丑陋摸样：android:ios:无奈的选择看完了这些丑陋的界面元素，我们就可以理解当我们把他们暴露在产品同学的眼中时，那种层层的杀气了... 阅读全文
Box-sizing：小身材，大拳头！
摘要：国庆回来，很久没写博客了。一来是自己毫无时间，二是最近开发任务特别紧，三是节后综合症，脑子一片空白没有找到写作的原材料。今天，在加完班回来的22点，忙里偷闲，分享一下最近学到的一个小知识点如题。标题的灵感来自于暴雪的一款卡牌游戏：炉石传说中的一张卡牌的上场台词，觉得很契合本篇博客要表达的含义，身材小 阅读全文
IOS9.0中hash值的bug与解决方案
摘要：事件起因 事情是这样的：产品上线发布，突然出现了问题。运营Gg过来反应，当场给露珠演示，运营同事的手机是iphone，bug确实是存在的。奇怪的是露珠用了其他iphone手机（借别人的，露珠的是吊死安卓机），却没有发现这个问题。仔细询问，同事说他最近刚刚升级的ios9，于是问题最初定位在操作系统上。 阅读全文
FLEX布局的一些问题和解决方法
摘要：前言露珠最近研究了一下flex的布局方式，发现项w3c推出的这套布局解决方案对于日益复杂的前端开发布局来说是确实是一利器，并且在不同的屏幕上实现了真正的响应式布局：不再单纯地依赖百分比和float的强拼硬凑来达到设计需求，在各个屏幕上显示效果友好，弹性的伸缩元素，简洁易维护的代码。只可惜，这位老兄有... 阅读全文
JS原型继承和类式继承
摘要：前言 一个多月前，卤煮读了一篇翻译过来的外国人写的技术博客。此君在博客中将js中的类（构造）继承和原型继承做了一些比较，并且得出了结论：建议诸位在开发是用原型继承。文中提到了各种原型继承的优点，详细的露珠不一一说明介绍了。这篇文章的名字是为什么原型继承很重要，有兴趣的同学可以去看，此文有些深度，值... 阅读全文
移动开发真机调试
摘要：做移动开发大多数的时候跟手机界面打交道，也就是说你只能在电脑上开发写代码，最终效果是确是在另外一个终端看到的。虽然各种浏览器为开发者提供了很多模拟手机设备的功能，这些功能总体来说基本可以满足我们对于调试移动设备的需求，比如露珠在之前向诸位介绍的手机开发者模式。但是模拟毕竟是模拟，它不能真正做到实现真 阅读全文
Chrome开发者工具不完全指南（六、插件篇）
摘要：本篇是Chrome开发者工具的结尾篇，最后为大家介绍几款功能强大的插件。在chrome商店里面有很多插件，没事建议大家去逛逛。不过需要FQ，所以诸位请自备神器。一、皮肤插件 首先是大家期盼已久，翘首以盼的皮肤插件。这款插件叫DevTools Theme: Zero Dark Matrix.在商店中下 阅读全文
Chrome开发者工具不完全指南（五、移动篇）
摘要：前面介绍了Chrome开发者工具的大部分内容工具，现在介绍最后两块功能Audits和Console面板。一、Audits Audits面板会针对目前网页提出若干条优化的建议，这些建议分为两大类，一类是网络加载性能，另一类是界面性能。首先开下它的主界面。 Audits面板的网络优化建议参照的是... 阅读全文
Chrome开发者工具不完全指南（四、性能进阶篇）
摘要：前言 Profiles面板功能的作用主要是监控网页中各种方法执行时间和内存的变化，简单来说它就是Timeline的数字化版本。它的功能选项卡不是很多（只有三个），操作起来比较前面的几块功能版本来说简单，但是里面的数据确很多，很杂，要弄懂它们需要花费一些时间。尤其是在内存快照中的各种庞杂的数据。在这篇 阅读全文
Chrome开发者工具不完全指南：（三、性能篇）
摘要：卤煮在前面已经向大家介绍了Chrome开发者工具的一些功能面板，其中包括Elements、Network、Resources基础功能部分和Sources进阶功能部分，对于一般的网站项目来说，其实就是需要这几个面板功能就可以了（再加上console面板这个万精油）。它们的作用大多数情况下是帮助你进行功 阅读全文
Chrome开发者工具不完全指南（二、进阶篇）
摘要：上篇向大家介绍完了基础功能篇，这次分享的是Chrome开发工具中最有用的面板Sources。 Sources面板几乎是我最常用到的Chrome功能面板，也是在我看来决解一般问题的主要功能面板。通常只要是开发遇到了js报错或者其他代码问题，在审视一遍自己的代码而一无所获之后，我首先就会打开Source 阅读全文
