全栈工程师的武器——MEAN

clipboard.png

JavaScript自1995年发布以来,走过了漫长的道路。已经有了几个主要版本的ECMAScript规范,单页Web应用程序也慢慢兴起,还有支持客户端的JavaScript框架。作为一个被绝大多数浏览器支持前台脚本语言,它对浏览器的创新做出了很大的贡献。JavaScript许多很有用的特点(它是无阻塞是,它是事件驱动的,很多程序员熟悉它)可以在浏览器之外的环境中加以利用。这推动了JavaScript社区新一轮的创新,让JavaScript能在服务器和数据库中运行。

Read More

使用 Page Visibility API ,让网站更友好

我们可能都有这样的经历:打开一个浏览器,加载之前打开的所有标签页,听到几个页面发出的混合在一起的声音。虽然浏览器通过标签的声音图标、插件等方法告知用户发声的页面,但这种体验还是很糟糕。作为开发者和设计者,我们有责任让网站更受欢迎。

网站是不是应该在被激活使用时才能发出声音?为什么我们要浪费资源和进程在我们看不到的动画上?

幸运的是,现在有一个解决方案:HTML5 有个页面可见(Page Visibility)的API。你可以看到Active Theory已经在新项目里使用了这个API。例如Under ArmorA Spacecraft For All:点击其他标签页,刚才还在运行的多媒体就会暂停。我喜欢把这样的网站成为“有礼貌的网站(polite web)”:网站考虑了用户的注意力、带宽等。

Read More

不依赖jQuery也能做好动画

在开发者社区中有种错误的观念——认为在web中,CSS动画是唯一高性能的动画方式。这使很多开发者放弃基于JavaScript的动画。所以导致——(1)强制使用大量样式表来完成复杂的UI交互,(2)不能很好地支持IE8、9,(3)放弃只有JS才能完成的完美物理运动效果。

事实证明:基于JavaScript的动画和基于CSS的动画一样快,甚至有时更快。CSS动画通常是和非常慢的jQuery $.animate()比较。但是,JavaScript库如果能避免像jQuery那样大量的DOM操作,性能就会非常高。这些库能比jQuery快20倍。

所以,让我们来打破一些神话,通过一些动画实例,并在此过程中提高自己的设计技巧。

Read More

世界各地程序员共同总结的前端面试题

常规问题

  • 最近你学了什么?
  • 是什么激发你对编程的兴趣?
  • 你最近在挑战什么新技术、你是怎么解决遇到的问题?
  • 当你在构建Web应用程序或网站时,你会考虑什么样的用户界面、安全性、性能、SEO、可维护性、选用的技术?
  • 谈谈你首选的开发环境(系统、编辑器或IDE、浏览器、工具等)
  • 你熟悉什么版本控制系统?
  • 请描述一下你创建一个网页的工作流程?

Read More

征服命令行

help.png

命令行(command line),也称为 CLI, Terminal, bash, shell……我们中有很多人很怕使用它,但其实只要你知道一些基本的命令和概念,就没什么好怕的了。(文中接下来的内容,命令行统一用 CLI 称呼)

Read More

小小标签,强大功能——深藏不露的 input

<input> 虽只是一个看似简单的 HTML 表单元素,但它这么一个单一的元素,就有多达 30 多个属性(attribute),相信无论你是个小菜鸟还是像我一样写了 15 年 HTML 的老手,知道这点的时候还是会惊讶不已的。而且如果再加上全局属性那就更多了,例如最重要的 type 属性有超过20个可能的值!可以来简单看看 MDN 文档

Read More

Ajax上传多文件

AJAX的采用标志着的Web历史上的一个巨大飞跃。与Web服务器通信而不需要重新加载页面的能力已改变了Web应用程序构建。动态网站的概念形成以后,AJAX(XMLHttpRequests) 技术发展迅速。

近年来XMLHttpRequests增加了一个很好的功能来处理文件上传。传统上,许多开发者用其他技术如Flash上传文件到服务器。这种方法的问题是,用户需要安装第三方浏览器插件的。

在这篇文章中你会学到如何用JavaScript技术将文件上传到服务器。我们将教你一个请求上传多文件的例子。然而,你可以用同样的办法上传单个文件。
让我们开始吧!

Read More