![]() And lastly, if you want normal URLs to work, and each of your pages to be bookmarkable, you will need even more JavaScript.ĭespite these downsides, the benefits can’t be ignored. You also need your backend to recognize requests made with Ajax, and to only send the page content instead of the full HTML document. You need JavaScript to handle the hijacking, the page fragment insertion, and the address bar hash changes (which allow the back and forward buttons to work normally). Using this system complicates your code a bit. The page fragments are extremely small ours are about 800 bytes (gzipped) on average.All pages that have been fetched will exist within the DOM clicking the back button (or clicking on a link for a page that has already been fetched) results in an instantaneous page load.Since you control the entire life cycle of the page fetch, you can display loading indicators or a wireframe version of the page while new pages load.We did this by hijacking all links of the page: when a link is clicked, we intercept the event, fetch the page fragment using Ajax, and insert the HTML into a new div. We can use this to our advantage by only loading the part of each page that changes. When navigating through a site, most of what changes from page to page is the actual content the JavaScript, CSS, header and footer stay mostly the same. Load Page Fragments Instead of Full Pages Every line in your CSS must be custom each property must be scrutinized to ensure it’s needed.Ģ. Frameworks make development faster and your final product more robust, but they, like the JavaScript libraries, include code for situations you won’t have to deal with. This means you can rip out code meant only for browsers that you won’t support (modular libraries like the new YUI 3.0 allow you to only include the code you use, preventing this problem somewhat). The only way to get the size of your JavaScript down is to selectively pull code out of libraries, and include only what you use. But for sites that are meant to be viewed over slow cellular connections like EDGE, 250 KB is an impossible amount of data. 250 KB of JavaScript or more isn’t uncommon for a large site these days. ![]() With such a high percentage of normal web users on broadband connections, we’ve gotten cavalier about what we can include in our pages. This means they potentially contain a lot of code that you don’t care about and won’t use. But these libraries walk a fine line by definition, they must work across a wide array of browsers and offer enough features to make them worth using. I’m a huge fan of libraries, especially YUI, mostly because they allow me to spend my time creating new stuff instead of working around crazy browser quirks. This was one of the hardest things for me to come to terms with. Don’t Use a JavaScript Library or CSS Framework Here are a few of the lessons we learned (sometimes painfully) while developing this site.ġ. A lot of the current best practices get thrown out the window in the quest for minimum page weight and fastest load times over slow cellular connections. Developing this site was very different from any other project I’ve worked on there seems to be a new set of frontend rules for developing high-end mobile sites. ![]() A few weeks ago we released a version of the Flickr site tailored specifically for the iPhone.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |