background preloader

Local Storage

Local Storage
You are here: Home Dive Into HTML5 Diving In Persistent local storage is one of the areas where native client applications have held an advantage over web applications. For native applications, the operating system typically provides an abstraction layer for storing and retrieving application-specific data like preferences or runtime state. Historically, web applications have had none of these luxuries. Cookies are included with every HTTP request, thereby slowing down your web application by needlessly transmitting the same data over and over Cookies are included with every HTTP request, thereby sending data unencrypted over the internet (unless your entire web application is served over SSL) Cookies are limited to about 4 KB of data — enough to slow down your application (see above), but not enough to be terribly useful What we really want is a lot of storage space on the client that persists beyond a page refresh and isn’t transmitted to the server Introducing HTML5 Storage HTML5 storage:

Google Font API Google recently debuted a new web service called the Font API. Google's Font API provides developers a means by which they may quickly and painlessly add custom fonts to their website. Let's take a quick look at the ways by which the Google Font API can be used. Font Request Format Many of the fonts within Google's font archive are available not only in standard format but also in Italic, Bold, and Italic Bold. Here are a few examples of requesting each variant: Cantarell Cantarell:bold Cantarell:italic Cantarell:bolditalic Now let's see how we can include special fonts in our page and use these them. The CSS Stylesheet Method The stylesheet gets included into the page like any other stylesheet would be. Take a moment to examine the stylesheet from Google: The @font-face method of font embedding is Google's chosen method. You may also embed the font within the "style" attribute of a given element: <p style="font-family:'Vollkorn';">Lorem ipsum.... I t doesn't get more painless than that.

Practical Introduction into Code Injection with AspectJ, Javassist, and Java Proxy The ability to inject pieces of code into compiled classes and methods, either statically or at runtime, may be of immense help. This applies especially to troubleshooting problems in third-party libraries without source codes or in an environment where it isn’t possible to use a debugger or a profiler. Code injection is also useful for dealing with concerns that cut across the whole application, such as performance monitoring. This post is aimed at giving you the knowledge that you may (or I should rather say “will”) need and at persuading you that learning basics of code injection is really worth the little of your time that it takes. Why You Are Going to Need It A lot has been already said about the advantages of AOP – and thus code injection – so I will only concentrate on a few main points from the troubleshooting point of view. The coolest thing is that it enables you to modify third party, closed-source classes and actually even JVM classes. Mini Glossary Advice Aspect Joint point I.

Canvas You are here: Home Dive Into HTML5 Diving In HTML 5 defines the <canvas> element as “a resolution-dependent bitmap canvas which can be used for rendering graphs, game graphics, or other visual images on the fly.” A canvas is a rectangle in your page where you can use JavaScript to draw anything you want. So what does a canvas look like? Invisible canvas The markup looks like this: Let’s add a dotted border so we can see what we’re dealing with. Canvas with border You can have more than one <canvas> element on the same page. Let’s expand that markup to include an id attribute: Now you can easily find that <canvas> element in the DOM. var a_canvas = document.getElementById("a"); Simple Shapes Every canvas starts out blank. Click to draw on this canvas The onclick handler called this function: function draw_b() { var b_canvas = document.getElementById("b"); var b_context = b_canvas.getContext("2d"); b_context.fillRect(50, 25, 150, 100); } And then there’s this Every canvas has a drawing context Paths path .

jQuery How do you judge a javascript programmer by only 5 questions Building Filesystems the Way You Build Web Apps (Ksplice Blog) FUSE is awesome. While most major Linux filesystems (ext3, XFS, ReiserFS, btrfs) are built-in to the Linux kernel, FUSE is a library that lets you instead write filesystems as userspace applications. When something attempts to access the filesystem, those accesses get passed on to the FUSE application, which can then return the filesystem data. It lets you quickly prototype and test filesystems that can run on multiple platforms without writing kernel code. FUSE has a reputation of being used only for toy filesystems (when are you actually going to use flickrfs?) But because the FUSE API calls separate functions for each system call (i.e. getattr, open, read, etc.), in order to write a useful filesystem you need boilerplate code to translate requests for a particular path into a logical object in your filesystem, and you need to do this in every FUSE API function you implement. Take a page from web apps RouteFS: URL routing for filesystems Getting started #! Populating the filesystem ~broder

Creating mobile Web applications with HTML 5, Part 2: Unlock local storage for mobile Web applications with HTML 5 02 Jun 2010: Added links to Part 3 of this series in About this series, Summary, and Resources sections. 08 Jun 2010: Added links to Part 4 of this series in About this series, Summary, and Resources sections. 29 Jun 2010: Added links to Part 5 of this series in About this series, Summary, and Resources sections. About this series HTML 5 is a very hyped technology, but with good reason. In this five-part series, you will take a closer look at several of those new technologies that are part of HTML 5 and can have a huge impact on mobile Web application development. Back to top Prerequisites In this article, you will develop Web applications using the latest Web technologies. Local storage 101 Web developers have struggled with storing data on the client for ages. Fortunately for Web developers, the HTML 5 specification finally contains a standard for local storage that is implemented by a wide variety of browsers. The Storage APIs The localStorage API is quite simple. Listing 1. Saving locally