Search

12/28/2012

Asynchronous and deferred JavaScript execution explained

Asynchronous and deferred JavaScript execution explained - defer 會先拉, 然後等到 HTML parser 直行完才會跑 javascript, async 會拉完javascript馬上執行, 可以跑一些與 DOM 無關的 javascript, 此外, async是一拉完就執行不保證會按照順序執行, defer會按照順序執行

  • Normal execution <sscript> This is the default behavior of the <script> element. Parsing of the HTML code pauses while the script is executing. For slow servers and heavy scripts this means that displaying the webpage will be delayed.
  • Deferred execution <script defer> Simply put: delaying script execution until the HTML parser has finished. A positive effect of this attribute is that the DOM will be available for your script. However, since not every browser supports defer yet, don’t rely on it!
  • Asynchronous execution <script async> Don’t care when the script will be available? Asynchronous is the best of both worlds: HTML parsing may continue and the script will be executed as soon as it’s ready. I’d recommend this for scripts such as Google Analytics.
HTML5's async Script Attribute
Both async and defer scripts begin to download immediately without pausing the parser and both support an optional onload handler to address the common need to perform initialization which depends on the script. The difference between async and defer centers around when the script is executed. Each async script executes at the first opportunity after it is finished downloading and before the window’s load event. This means it’s possible (and likely) that async scripts are not executed in the order in which they occur in the page. The defer scripts, on the other hand, are guaranteed to be executed in the order they occur in the page. That execution starts after parsing is completely finished, but before the document’s DOMContentLoaded event.

Chrome 線上應用程式商店 - Postman - REST Client

Chrome 線上應用程式商店 - Postman - REST Client - Postman - REST Client Postman - A powerful HTTP client to test web services

Postman is a powerful HTTP client to help test web services easily and efficiently. Postman let's you craft simple as well as complex HTTP requests quickly. It also saves requests for future use so that you never have to repeat your keystrokes ever again. Postman is designed to save you and your team tons of time. Check out more features below or just install from the Chrome Web Store to get started.

12/11/2012

SwipeView

SwipeView

SwipeView is the super simple solution to endless seamlessly loopable carousels for the mobile browser. It’s memory conservative as it uses only three elements at any given time, it’s smooth as velvet since it takes advantage of hardware acceleration, it’s bandwidth friendly with its 1.5kb minified/gzipped footprint.
tag: three panel

@他/她是不是你的靈魂伴侶?--5個方法判斷

@他/她是不是你的靈魂伴侶?--5個方法判斷

只要看看這個和你互動的人,符不符合下面5個標準: (1).他喜歡你表現出最不做作的本真,不喜歡你連自己都討厭。你不愛化妝,他剛好欣賞你清水出芙蓉的自然美;你討厭應酬,他剛好也喜歡宅在家。 (2).他能引導你做更好的自己。但你的驅策力,不是因為他要求,而是純然發自內心,願意為他改善自我,把自己變得更健康、更包容、更快樂。 (3).無論遇到什麼挫折,他都願意和你互動下去。一點小麻煩,就說拜拜的,鐵定不是你的“靈魂伴侶”。廖閱鵬說:“很多人的關係是很淺的,遇到一點阻力,就退縮或放棄;但靈魂伴侶願意跟你一起忍受所有的不舒服,無論美醜,都會勇敢面對彼此內在的真相。” (4).他能和你一起堅持成長。假如只是天長地久廝守,卻不能彼此進步,也不算。長期從事身心靈工作的Anita說:“如果遇到靈魂伴侶,兩個人在一起,進步幅度會比獨自一人快很多倍。” (5).他對生命充滿熱情,願意在生命中付出精力和心血,與你一起勇敢挖掘,探索,體驗。不過,要留神,所有這些都需要你和他相處一段時間以後,才感受得到。千萬別指望第一樣見到,就能知道對方是不是自己的“靈魂伴侶”。在靈魂伴侶這件事上,最好順其自然,而不是四處尋找。

12/10/2012

GENERALIZED INPUT ON THE CROSS-DEVICE WEB

GENERALIZED INPUT ON THE CROSS-DEVICE WEB

$(window).mousedown(function(e) { down(e.pageY); });
$(window).mousemove(function(e) { move(e.pageY); });
$(window).mouseup(function() { up(); });

// Setup touch event handlers.
$(window).bind('touchstart', function(e) {
  e.preventDefault();
  down(e.originalEvent.touches[0].pageY);
});
$(window).bind('touchmove', function(e) {
  e.preventDefault();
  move(e.originalEvent.touches[0].pageY);
});
$(window).bind('touchend', function(e) {
  e.preventDefault();
  up();
});
Microsoft is taking a very smart approach with IE10 to address this issue by introducing pointer events. The idea is to consolidate all input that deals with one or more points on the screen into a single unified model. Unfortunately, it's not being proposed as a standardized spec. Also, because it's not universally available, it will be yet another thing developers need to support (if they want to support Windows 8/Metro apps). So now our sample above gets even more boilerplate, with at least three more calls like the following:
$(window).bind('MSPointerDown', function(e) {
  // Extract x, y, and call shared handler.
});
$(window).bind('MSPointerMove', function(e) {
  // Extract x, y, and call shared handler.
});
$(window).bind('MSPointerUp', function(e) {
  // Extract x, y, and call shared handler.
});