Development Update – Week of April 25, 2011
This and next week, the team is primarily focused on re-factoring and optimizing the Ajax navigation system and page transitions in jQuery Mobile to make them more extensible and stable. Here is a recap of our activities this week.
Navigation re-write in progress
We’re in the process of re-factoring our URL handling for Ajax-driven navigation to be more robust and are starting to plan extensibility points in the system to make it easier for developers to tweak and extend the navigation behavior. For typical web use, we will continue to use site relative URLs in the hash for same host/protocol to keep the URLs from being too unwieldy and plan on eventually adding Ajax replaceState to further improve the length and readability of URLs in typical situations.
To better support PhoneGap developers that use file:// protocols extensively, we’re considering how to best support scenarios where the document may initially contain a base tag that specifies a URL that has a different protocol and/or host from the document URL, or cases where the page containing the link was in an externally loaded page that may have specified a different URL with the @data-url attribute. Our proposed solution is to have jQuery Mobile check to see if the page was loaded with file:// protocol and it is attempting to load a page via the http:// protocol. If this occurs and the $.mobile.allowCrossDomainPages configuration flag is also set to true, jQuery Mobile will switch to absolute mode (isExternal) where it looks at the full absolute path and checks the hostname, protocol and link.href to ensure that everything is properly resolved. Before we start re-writing code, we’re going to beef up our test coverage this week around navigation to ensure that we avoid any regressions. Read more about the details of the navigation re-write on the planning wiki.
Page transitions: decoupled and extensible
We’ve been working on pulling page transitions out into a separate plugin so they can be decoupled from the navigation plugin. As part of this re-work, we’re introducing the ability for developers to create custom transitions created with pure CSS3, or in combination with JavaScript by adding extensibility hooks to the transition system. The development work has been completed and pushed into master so grab the latest if you want to start hooking in your own custom transitions.
Mobile profiler code released
Team member Kin Blas from Adobe has built some really great profiling tools that we use for optimizing our code. He recently released this code on GitHub so grab the code and start helping us find places to optimize our code: https://github.com/jblas/profiler
Notable changes
Tops of pages clipped after returning from a dialog (issue 1461)
If you had scrolled down on a page, opened a dialog, then closed it, the page height was getting clipped off in iOS due to the timing of when we were placing focus back on the page. Solution: Delayed the setting of focus till after the scroll position is restored.
Active class not being removed correctly
If a link had an null or “#” value for the href, the active class wasn’t being removed. To fix this, we modified the vclick handler code in navgation.js so that it doesn’t place the ui-btn-active class on any links meant for interactivity. Removed the return false in the vclick handler of collapsible and replaced it with a preventDefault(). The only reason we were returning false was to stopPropagation() so that the vclick handler in navigation.js didn’t place a ui-btn-active on it.
jQuery 1.6 RC now in master
In preparation for the 1.6 release, we’ve been testing with the latest jQuery core RC. So far, we haven’t seen any issues but let us know if anything crops up in your testing.
Listview refresh and filtering performance
We’ve really speed up the listview since 4.1 so if you have a site or app that uses long listviews, be sure to grab the latest version (see below) to get the best performance.
Get the latest build with our nightlies
To take advantage of the daily improvements happening in jQuery Mobile, be sure to check out out the new daily and latest builds that are now available on the jQuery CDN for hotlinking. This allows you to upgrade to the latest code without waiting for the next official release.