JavaScript日期格式化函数

蓝飞 蓝飞 | 时间:2013-01-24, Thu | 4,601 views
前端开发 
Date.prototype.format = function(mask) {
    var d = this;
    var zeroize = function (value, length) {
        if (!length) length = 2;
        value = String(value);
        for (var i = 0, zeros = ''; i < (length - value.length); i++) {
            zeros += '0';
        }
        return zeros + value;
    };
    return mask.replace(/"[^"]*"|'[^']*'|\b(?:d{1,4}|m{1,4}|yy(?:yy)?|([hHMstT])\1?|[lLZ])\b/g, function($0) {
        switch($0) {
            case 'd':   return d.getDate();
            case 'dd':  return zeroize(d.getDate());
            case 'ddd': return ['Sun','Mon','Tue','Wed','Thr','Fri','Sat'][d.getDay()];
            case 'dddd':    return ['Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday'][d.getDay()];
            case 'M':   return d.getMonth() + 1;
            case 'MM':  return zeroize(d.getMonth() + 1);
            case 'MMM': return ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'][d.getMonth()];
            case 'MMMM':    return ['January','February','March','April','May','June','July','August','September','October','November','December'][d.getMonth()];
            case 'yy':  return String(d.getFullYear()).substr(2);
            case 'yyyy':    return d.getFullYear();
            case 'h':   return d.getHours() % 12 || 12;
            case 'hh':  return zeroize(d.getHours() % 12 || 12);
            case 'H':   return d.getHours();
            case 'HH':  return zeroize(d.getHours());
            case 'm':   return d.getMinutes();
            case 'mm':  return zeroize(d.getMinutes());
            case 's':   return d.getSeconds();
            case 'ss':  return zeroize(d.getSeconds());
            case 'l':   return zeroize(d.getMilliseconds(), 3);
            case 'L':   var m = d.getMilliseconds();
                        if (m > 99) m = Math.round(m / 10);
                        return zeroize(m);
            case 'tt':  return d.getHours() < 12 ? 'am' : 'pm';
            case 'TT':  return d.getHours() < 12 ? 'AM' : 'PM';
            case 'Z':   return d.toUTCString().match(/[A-Z]+$/);
            default:    return $0.substr(1, $0.length - 2);
        }
    });
};

2013年10大网页设计趋势

蓝飞 蓝飞 | 时间:2013-01-01, Tue | 14,612 views
前沿信息, 前端开发 

TNW发布了2013年10大网页设计趋势:

  1. 响应式布局盛行,即一个网站适配多种屏幕;
  2. 重视字体的选择,使用Web字体;
  3. 更少的使用Flash,使用其他任何可能替代的技术;
  4. 苹果iOS的拟物化设计将不再时髦;
  5. 使用巨大的背景图构造大气的视觉效果;
  6. 产品和个人介绍页面留出更多空白;
  7. 更多的社交网络分享入口;
  8. 浅色、冷色调重新成为主流;
  9. 移动App将取代一部分移动网页流量;
  10. 内容依旧为王;

好了,该到我们年终展望新年的时刻了。2012年我们看到一些新的设计趋势在Web设计领域,特别是响应式页面设计。那么跟随我们的脚步,来预测一下2013年的设计趋势吧!

(阅读全文…)

[转载]高性能网站需避免的7个错误

蓝飞 蓝飞 | 时间:2012-12-14, Fri | 5,184 views
前端开发 

翻译是门体力活,最后一点内容实在没嚼头,有些捣糨糊,省了不少废话。

原文地址:http://www.sitepoint.com/seven-mistakes-that-make-websites-slow/

原文作者:Coach Wei

翻译编辑:zhangxinxu

假期临近(应该指感恩节和圣诞节),公司增加了SEM方面的花费,关注SEO,修改页面。然而,为了最大的销售额,这些时间、财力上的付出可能就是打水漂——如果假期增加了访问量让网站速度变慢甚至下去的话。

性能影响用户是毫无疑问的。网站速度直接影响反弹率、转化率、收入、用户满意度、搜索引擎优化(已知的如反映网站流行度的Page Rank)以及几乎所有值得追踪的业务。用户离开速度慢的网站,而且往往不会再回来。

还在不久前,用户离开一个网站的时间点是8秒。然而,很快就是6秒,然后4秒,然后现在是2秒。门槛一直在提高。

小小性能改变,大大影响发生

用户的耐心不是线性的。第1秒的时候基本上没有人会放弃这个站点。但是,1秒开外之后,如果没有适当的反馈的话(例如浏览器标头显示页面标题),用户开始以一个加速的比率离开。到3~4秒的时候,一般的站点会一半的潜在用户。当然,具体的阈值根据网站、用户行为和意图以及其他因素不同而有所不同……但万变不离其宗。

瓶颈

快速测试:当HTML载入浏览器之后,用户等待你页面加载的时间百分比是多少?如果你不是做web开发的,或是经常混迹于性能社区的话答案可能会让你大跌眼镜。一般超过90%,用户花在等待上的时间的90%实在页面HTML载入到浏览器之后。为什么会这样呢?

(阅读全文…)

[转载]你真的已经搞懂JavaScript了吗?

蓝飞 蓝飞 | 时间:2012-12-02, Sun | 13,014 views
前端开发 

昨天在著名前端架构师Baranovskiy的博客中看到一个帖子《So, you think you know JavaScript?》

题目一:

if (!("a" in window)) {
    var a = 1;
}
alert(a);

题目二:

var a = 1,
    b = function a(x) {
        x && a(--x);
    };
alert(a);

题目三:

function a(x) {
    return x * 2;
}
var a;
alert(a);

题目四:

function b(x, y, a) {
    arguments[2] = 10;
    alert(a);
}
b(1, 2, 3);

题目五:

function a() {
    alert(this);
}
a.call(null);

请不要借助任何帮助工具,心算答案。答案在下面。

(阅读全文…)

10个步骤让你成为高效的Web开发者

蓝飞 蓝飞 | 时间:2012-10-26, Fri | 15,709 views
心路历程, 前端开发, 后台技术 

要成为高产、高效的 Web 开发者,这需要我们做很多工作,来提高我们的工作方式,以及改善我们的劳动成果。

下面是 10 个提高效率的步骤,虽然不能保证解决你在开发中的所有问题,但至少是非常实用的,可以简化你的 Web 开发流程,使开发的每一个环节快速、流畅。还可以帮助你节省大量的时间,以便开发更多、更好的项目。

1. 使用 Web 开发框架

一个良好的 Web 开发框架,可以帮助你:

  • 解决常见的 Web 开发问题,如标准的 Web 页面布局、Web 表单处理、浏览器兼容性解决等)。
  • 测试 Web 开发的 bug、安全和性能
  • 使代码重用更容易,因为有一个统一的 API。
  • 社区开发的插件和工具,可以进一步增强开发(jQuery 有很多非常棒的插件,比如用户界面、图像和网页排版等)。
  • 遵循编码的最佳实践和伟大的编程设计模式,你甚至不用去思考
  • 有开发社区和用户的支持,你可以获取帮助以及进行协作。
  • 初学者使用起来非常容易。

所有这些好处都可以节省你的时间以及提高项目的质量。

(阅读全文…)