IT技术博客大学习 共学习 共进步
首页 / 前端码工
IT 2016-04-02 14:09:17 / 累计浏览 1,540

提高JavaScript性能

这篇讲的是如何从多个层面提升JavaScript代码执行效率。作者开篇就指出了JavaScript作为解释型语言的固有速度劣势,与编译语言相比差距悬殊,因此优化显得尤为重要。 文章从具体实践出发,分享了四个核心优化方向。在作用域方面,强调通过缓存全局对象(如document)的引用来减少作用域链查找,并避免使用会拖慢速度的`with`语句。对于算法选择,文章深入到了循环优化的细节,包括采用减值迭代、简化终止条件,并介绍了如何运用Duff装置等技术来高效展开循环。 此外,作者还提醒开发者注意减少不必要的语句解析,例如合并变量声明、使用数组和对象字面量来替代`new`操作符。最后,文章点明了DOM操作是性能瓶颈的关键所在,因其会触发昂贵的页面重绘。 整体来看,这些技巧从微观的代码写法到宏观的策略选择,构成了一份实用的JavaScript性能优化清单。

IT 2016-04-02 14:07:40 / 累计浏览 3,260

CentOS上搭建Git服务器

这篇讲的是如何在CentOS服务器上从零搭建一套功能完备的Git代码托管环境。作者面对的核心需求是建立一个集中式的版本库,用于团队协作和代码管理,同时希望方案对服务器性能的影响尽可能小。 文章给出的解决方案是一套组合拳:使用Git作为底层版本控制工具,并搭配gitosis和gitweb两个组件。其中,gitosis专门负责基于SSH协议的仓库权限管理,而gitweb则提供了一个简单的Web界面,方便开发者在线浏览代码和提交历史。文章以“折腾”的口吻,依次拆解了这三个部分的安装与配置过程,从yum安装基础软件包、创建git用户,到克隆gitosis源码进行安装、配置SSH密钥实现安全访问,最后安装fcgiwrap与spawn-fcgi来驱动gitweb。 整个流程清晰且具有可操作性,比如在配置客户端多公钥共存时,就给出了具体的.ssh/config文件示例。最终搭建完成的服务器既能通过SSH进行高效的代码推送与拉取,也能通过网页轻松查看项目状态,是一个轻量且实用的自托管方案。

IT 2016-04-02 13:25:37 / 累计浏览 1,900

utf-8页面form提交到gb2312页面编码的问题

这篇讲的是一个在多编码页面交互时常见的“坑”:UTF-8页面中的表单,通过GET方式提交到另一个UTF-8页面进行处理后,再将参数传给编码为GB2312的iframe页面,结果数据变成乱码。作者明确这是编码转换不一致导致的问题。 在尝试了用VBScript处理(不跨浏览器)和嵌套空白页提交(过于繁琐)等方案后,文章推荐了一个非常简洁有效的解决方法。核心是利用了HTML表单一个不太常用的属性:`accept-charset`。只需在表单标签中加入`accept-charset="gb2312"`(若提交到UTF-8页面则反之),即可告知浏览器按指定编码提交表单数据。 不过,针对IE浏览器的特殊性,作者还补充了一个关键的Hack:需要在`onsubmit`事件中添加`document.charset='gb2312'`。这样,仅仅几行代码,就能让不同编码的页面间正确传递表单参数,避免乱码。

IT 2016-03-30 16:01:23 / 累计浏览 1,080

javascript动画剖析

这篇讲的是作者从重构自己的JavaScript动画框架easyAnim出发,深入剖析了JavaScript动画背后的底层原理和实现思路。 文章先拆解了动画运行的核心机制:如何将CSS属性值字符串解析为数值与单位,并基于总距离、总时间和时间比公式计算出每一帧的精确位置。作者特别提到了帧率(fps)的选择,对比了主流框架(如jQuery设置13ms间隔,约75fps)与他自己设定为16ms(约60fps)的考量,这是平衡流畅度与性能的关键。 在实现层面,文章梳理了两种常用的缓动(tween)函数风格:flash流派的多参数函数与prototype流派简洁的单参数时间比函数。后者因为封装更好,被作者以及新版jQuery和YUI3所采用。此外,文章还通过伪代码讲解了如何用队列数组和“running”标志来编排多个动画的顺序执行,确保复杂动画效果的有序进行。 最后,作者点出掌握了这套“解析-计算-缓动”的流程,就能轻松扩展动画能力,比如实现颜色、阴影等更多属性的动画。整体上,文章将动画实现拆解为可复用的模块,思路清晰,对想深入理解前端动画原理的开发者很有参考价值。

IT 2016-03-30 16:00:26 / 累计浏览 3,140

wordpress/nginx安全设置

这篇讲的是如何给WordPress博客加固登录安全,作者从两个实战层面入手:插件增强认证与通信链路加密。 首先,文章详细演示了如何通过Google Authenticator插件为WordPress登录添加双重验证。这类似于谷歌账户的“两步验证”,原理是在密码之外,增加一道由手机App动态生成的验证码,能有效防范密码泄露风险。作者还梳理了其他类似安全插件,如一次性密码、IP锁定等,提供了更全面的选择思路。 其次,更进阶的一步是配置Nginx反向代理下的SSL(HTTPS)登录。作者不仅说明了如何在WordPress配置文件中启用强制SSL,还提供了从生成自签名证书到编写完整Nginx配置的全过程。过程中特别指出了一个典型坑点:Nginx配置不当会导致后台CSS文件的MIME类型错误,并给出了具体的修正配置,这部分对实际操作很有参考价值。 整个方案从认证加固到传输加密,层层递进,解决的是WordPress站点常见的登录安全隐患,过程细节扎实,踩坑点清晰。

IT 2016-03-30 15:59:32 / 累计浏览 1,980

AJAX页面状态保持

这篇讲的是如何在AJAX驱动的单页应用中保持页面状态,解决刷新后页面重置、无法分享特定状态的问题。作者从传统多页应用的状态管理切入,对比了两种主要思路:一种是传统URL参数(如`?s=abc&id=23&page=3`),刷新会重新请求页面;另一种是利用URL的hash部分(如`#s=abc&id=23&page=4`),修改hash不会触发页面重载。 文章详细分析了hash方法的实现细节与兼容性挑战。早期方案通过定时器轮询检测hash变化,简单但有延迟;HTML5标准引入了`hashchange`事件,能实时响应hash更改,主流浏览器如Firefox 3.6、IE8、Chrome等均已支持,但IE6/7及IE8兼容模式仍需特殊处理——例如用隐藏iframe同步hash来维护历史记录。文中还以Gmail为例,说明大型应用如何实践状态保持,并提及RSH、History Framework等专用库。 通过对比,可以看出:传统URL参数适合需完整刷新或SEO的场景;hash方法更适合追求流畅体验的SPA,但开发者必须针对不同浏览器做降级处理。文章梳理了从轮询监听到事件驱动的技术演进,为处理前端状态管理提供了清晰的路径选择。

IT 2016-03-23 17:52:22 / 累计浏览 2,080

网页布局中对全局字体的最佳控制

这篇讲的是如何在网页CSS中设置全局`font-family`,作者基于实际踩坑经验,对比了几种常见写法的优缺点,最终给出了一个跨平台的推荐方案。 文章对比了包括`Arial, sans-serif`、`"宋体", sans-serif`、`Tahoma, sans-serif`等几种写法。例如,直接使用“宋体”在Safari和Vista的IE7下显示效果差,且英文部分不美观;而使用Tahoma虽然字体漂亮,但在IE6中会出现中文下划线贴紧、13px字号显示异常以及混合排版时`vertical-align`导致的文字错位等具体bug。 相比之下,`font-family: Arial, sans-serif;`被作者认为是全局字体设置中最合适的选择。它解决了Tahoma在IE6下的前两个问题,且第三个布局bug也有成熟的`zoom:1`解决方案。文章最后还补充了一个重要细节:在IE浏览器中,所有表单元素(如`input`、`select`)不会继承`body`的字体,需要单独显式设置。 作者从多种写法的实践对比出发,最终收敛到一个兼顾不同操作系统(XP、Vista、Mac)默认字体显示效果,且规避了常见浏览器渲染bug的解决方案,这对于处理复杂的前端兼容性问题有很强的参考价值。

IT 2016-03-21 23:57:20 / 累计浏览 2,240

浅谈javascript闭包

这篇讲的是 JavaScript 里一个既核心又让人头疼的概念——闭包。作者从它的重要性入手,直言这是通往高级开发者的必经之路,也是面试中的常考题。 文章没有堆砌复杂定义,而是从最常用的匿名函数形式 `(function(){})();` 切入,直观地展示了什么是闭包。随后,通过对比函数内外变量的作用域(比如函数内可以读全局变量,反之则不行),自然地引出闭包的核心特性:一个内部函数,即使被返回到外部调用,依然能记住并访问它诞生时所在的外部函数作用域。 为了把这个机制讲透,作者还引用了《JavaScript高级程序设计》中关于执行环境和作用域链的解释,说明了内部函数通过作用域链“抓住”外部变量的原理。最后点明,闭包在 Scheme、Python 等众多语言中都有体现,是编程中的一个重要范式。整篇文章结合了概念、代码和原理剖析,把闭包从“难点”变成了可理解的具体逻辑。

IT 2016-03-21 23:55:14 / 累计浏览 3,040

centos误删东西的教训

这篇文章源于作者一次惊险的误操作经历。在尝试通过WinSCP向CentOS服务器传输文件时,因Dropbox被屏蔽和软件问题导致传输中断。作者随后移动(mv)了未完成的文件夹,而在清理时,不慎将其中的WordPress程序目录一并删除,险些酿成数据丢失的严重后果。 幸运的是,作者此前在本地测试环境留有备份,得以成功恢复。这次教训促使他立即采取了预防措施:在 `~/.bashrc` 文件中为 `rm` 和 `mv` 命令添加了 `-i`(交互式确认)别名。这意味着未来执行删除或移动操作时,系统会要求二次确认,从而有效避免手滑带来的风险。 这是一个非常典型的运维“手速”事故案例,作者分享的具体补救方法和预防性配置,对于任何使用命令行进行文件操作的开发者和运维人员都具有实用的参考价值。

IT 2016-03-21 15:04:04 / 累计浏览 2,260

iframe异步加载技术及性能

这篇讲的是四种iframe加载技术的性能对比与最佳实践。作者从“如何不让iframe阻塞主页面onload事件”这一核心问题出发,详细剖析了普通加载、onload之后加载、setTimeout动态加载以及异步加载这四种方法的实现与表现。 对比的关键在于各方法对主页面加载进程的影响。普通方法简单直接,但iframe加载会阻塞主页面的onload,对用户体验和页面评分不利。将iframe加载推迟到主页面onload之后,或使用setTimeout,可以避免阻塞onload,但浏览器仍可能长时间显示忙碌状态,尤其在IE8下setTimeout方案存在兼容问题。 文章重点推荐了“异步加载iframe”技术。其巧妙之处在于先创建一个空的iframe,利用其body标签的onload事件立即触发的特性,再在回调中动态创建script标签来加载实际内容。这种方法能真正实现无阻塞加载,iframe加载时浏览器不再显示忙碌状态,综合性能表现最佳。作者也客观指出,该技术因某些原因未受足够关注,但仍值得开发者在需要无阻塞加载第三方内容(如插件、广告)时深入了解和采用。