YUI 3.0 Preview Release 1

The Yahoo! User Interface development team has released the first preview version of YUI 3.0. According to the team blog, there are 5 goals for the new release: lighter code (in kb), faster code (fewer HTTP requests, more compact code), greater API consistency, more powerful API capability, and more securable code.

What's New?

  • Sandboxing: each YUI instance can now be separated from other instances via YUI.use()
  • Modularity: YUI 3.0 is architected to use smaller, more re-usable modules.
  • Self-completing: With the seed file in place, you can tell YUI what modules you want to use, and it will download them in a single HTTP request.
  • Selectors: Elements can be targeted via CSS selector idioms (much like jQuery)
  • Enhanced Custom Events: Custom Events in YUI 3.0 have been enhanced with support for bubbling, stopping propagation, assigning/preventing default behaviors, among other things.
  • Nodes and NodeLists: You can now reference elements via Node and NodeList facades, allowing a more fluid API.
  • Chaining: YUI is adopting a fluent interface style, using method chaining to achieve greater expressiveness (and compactness)

For those who don't like the jQuery-style fluent interfaces in YUI 3.0, a more explicit/verbose API is still available. YUI 3.0 will not be completely backward compatible with YUI 2.0, but there will be a limited compatibility layer.

You can download the preview release here. A final release is not anticipated until next year.

Auto Resize iFrames - Part 1


At times you may need to load content from other domains or websites into a web application that you are creating. One of the most common ways to accomplish this is to use an iFrame to load the content (this is assuming that you just want to display a web page in your application). In some cases you will want to load content and have the iFrame re-size based on the content that is being loaded into the iFrame.

The interesting thing is that there is no easy way to do this. You can't set the iFrame's width and height properties to 100% as this will have the iFrame take over the screen and not just re-size based on content. The solution that I came up with is the use of a server side proxy (which gets around cross-domain issues) and some javascript that is added from the server side proxy code to re-size the iFrame.

This first post will give you an idea on how this would be accomplished. In my next post I'll talk about the code that would be used and discuss the pros and cons (as well as other methods that could be used to accomplish the same effect). So make sure to check your feed reader for the next post...

XML Backlash?


Now in the fourth edition of version 1.0 or second edition of 1.1, XML has enjoyed a popularity matched by few other technologies. Introduced in 1998 as a more general-purpose (and extensible) markup language than HTML (and also derived from SGML), XML has spawned a host of other related technologies (XPath, XSL/XSLT, XQuery, XML Schema, Relax NG, etc.) as well as a plethora of XML-based dialect languages covering every conceivable purpose.

In the world of enterprise programming (most notably Java), XML extended its reach to become the data/configuration/metadata format of choice. At one point in time, any software framework that even had a vaguely enterprise-y smell to it relied on XML almost as a matter of course: J2EE (EJB, Servlet API, JSF, etc.), Struts, Spring, Tapestry, and the list goes on. When the ability to communicate via HTTP between browser requests was popularized in 2005 (famously by Jesse James Garrett), XML was so prevalent that it was simply assumed that this was the data serialization format of choice--hence the term AJAX (Asynchronous JavaScript and XML) or the "XmlHttpRequest" object. Use of XML was simply unquestioned.

Then something happened, or started to happen...In the last few years other technologies have begun to encroach in some of the areas where XML was once so dominant: annotations in Java (attributes in C#), JSON , Protocol Buffers, and even YAML. Dissatisfaction with XML is on the rise. Could it be that developers are realizing that XML is not good for everything? The evidence is growing:

  • Much of the motivation behind Google Guice was to create as a "pure java"--i.e., sans XML--implementation of a dependency injection framework. One of the creators of Guice, "Crazy" Bob Lee, has made no bones about his disdain for XML as a framework design tool.
  • Spring itself followed suite, introducing a pure-annotation approach to dependency injection (in addition to the XML-based approach) in Spring 2.5.
  • Wicket advertises itself as having a "refreshing lack of XML".
  • JSON's compactness and ease of serializing/deserializing to and from JavaScript has made it a very appealing alternative to use of XML, and has taken a big bite out of the X in AJAX.
  • Numerous official Java specifications (EJB 3.0, JPA, JSF 2.0, Servlet 3.0) are moving away from the use of XML metadata and towards Java annotations. This is really one of the largest pieces of damning evidence, as Java specifications were one of the major drivers behind the canonization of XML as a key enterprise technology.
  • Some people have even gone as far as to dedicate web sites explaining why XML sucks.

Of course, as one may point out, this could just be the "vocal minority" voicing objections while the quieter majority continue to use it--and indeed the use of XML and the development of XML-related technology shows no sign of really slowing down. But this trend does raise the legitimate question of whether or not XML has really over-reached its original purpose (and usefulness), and needs to be re-evaluated for some of the use cases to which it is currently being applied. So, now that XML is in the denouement of its hype cycle, it is a good candidate for a more honest evaluation of its strengths and weaknesses.

Let's start with the minuses...

Drawbacks of XML

  • Verbose: By its very nature as a markup language, XML contains considerable redundancy (i.e., <tag></tag>). While this suits the hierarchical structure of markup languages well, it can be a big drawback, especially when dealing with large amounts of data. This verbosity carries real consequences in terms of processing efficiency and network transmission overhead. Technologies like MTOM or XOP are really a hack to get around this problem.
  • Trees: The hierarchical tree structure of XML is a generally useful structure, but is not naturally suited to every problem domain. Some types of data are simply better suited to other data structures: lists, maps, etc. Unnecessary representation of this data as a tree carries some consequences in terms of processing efficiency and complexity.
  • Markup Language: XML is a markup language, not an imperative or functional language. And it is not good at faking either one. This seems to be a fundamental point missed by some fairly knowledgeable people. The otherwise well-designed BPEL is a case in point: right ideas, wrong technology. This doesn't mean that XML can't be used as a kind of "Poor Man's DSL", but being declarative is about as far as one should stretch a markup language.
  • Language Metadata: Though specifications like XML Schema brought a kind of type system to XML, this was a type system meant to be language agnostic. Historically speaking, however, it is common to see XML applied as a tool for language metadata, forcing the tedious and non-typesafe use of references to language types. This is the classic XML attribute class="com.example.Foo" seen in way too many Java enterprise frameworks. A real facility for language metadata (annotations in Java or attributes in C#) is a much better solution.

Nothing world-shaking here. Most developers having to type out XML documents have probably thought of these at some point in time. So what are the good points?

Advantages of XML

  • Platform and Language Neutral: Although other competing technologies can make the same claim, this is one of the big reasons for the rise in XML's popularity in the first place.
  • Great tools: There are a very rich set of tools for working with XML, which is certainly one of the reasons for its great popularity. This makes working with XML a much simpler choice, since in most languages the parser and other tools have already been written for you.
  • Readability: Some people may argue with this and provide good counter-examples (EJB deployment descriptor files come to mind), but in general 90+% of XML documents I've ever seen are fairly readable. This readability, however, certainly does not scale: larger, more complex XML documents tend to be fairly unreadable, but this is often more of a consequence of the misapplication of the technology.
  • Namespaces: Although using different namespaces in an XML document can have some unexpected surprises for the beginner, generally speaking namespaces are a pretty powerful feature of XML. They enable, among other things, ideas like "mashups"--i.e., XML documents being extended or combined with other XML documents (or content) in ways not necessarily foreseen by the providers of those documents (think Yahoo Pipes). Being able to avoid conflicts between different data sources is one of XML's great advantages over other technologies that do not support namespaces.
  • Validation: Built-in data validation is another one of XML's advantages. However one may feel about the widely-used standard, XML Schema, having the heavy lifting of this tedious functionality off-loaded from the author to the tools is truly a blessing.

Using simple math, it would seem that the advantages outweigh the disadvantages. But of course, it isn't that simple and the benefits vs. drawbacks have to be weighed on an individual basis. Most of the abuses of any given technology usually stem from the case that simple facts like this get overlooked or forgotten amidst the hype. In the worst cases, this kind of thinking results in elaborate specifications that are designed simply as workarounds to the limitations of the technology. The "right tool for the right job" is the caveat here, but the warning seems easily forgotten.

The popularity of XML is definitely here to stay and the technology is generally "good enough" for most purposes to which it has been applied. But I think that it is important, as with any technology, to apply some critical thinking before using it for a given purpose. If you find yourself in the middle of coding an elaborate workaround to a problem you are encountering (performance or otherwise), the question "Why am I doing this?" should be more than a passing thought. A little (un?)common sense goes a long way in building the right solution.

CGLIB 2.2 Becomes Final


From the "snuck by me department": CGLIB 2.2, which had hovered in beta for a seemingly endless period of time, became final in May of 2008. The brief release notes explain that it contains a patch for a race condition in MethodProxy as well as an upgrade to ASM 3.1. For those who aren't familiar with CGLIB, it is a very lightweight Java library originally created as a faster alternative to java.lang.reflect.Proxy. It has seen use in many well-known projects such as Hibernate, Spring, and more recently Google Guice.

Create Web 2.0 Progress Bars: jQuery, DHTML, JS, CSS, Photoshop


Progress bars are extremely usefull in Ajax applications as it lets people know when you are loading information in the background. Well the DeveloperFox blog has put together a nice list of progress bars using jQuery, JavaScript, CSS and PhotoShop.

Below is an excerpt from the post.

jQuery Progress Bars

jQuery.UI ProgressBar Widget


HOWTO: PHP and jQuery upload progress bar



“jqUploader is a jquery plugin that substitutes html file input fields with a flash-based file upload widget, allowing to display a progressbar and percentage. It is designed to take most of its customization from the html code of your form directly - so you don’t have to do things twice . For instance, the maximum file size, if specified via html, will be recognized and used in the rich upload interface generated by jqUploader.

The plugin uses the form action attribute value (normally pointing to a server side script handling the upload and other data manipulations, and appends a variable “jqUploader=1? so that the upload code is initiated when it sees that key/value is on the posted data.”


Progress Bar Plugin

This is a progress bar plugin for jQuery.


To read the full post click here.

Continuous scrolling pattern using JavaScript and ASP.NET


You have probably seen some of the search engines where you can keep scrolling through your search results and they load as you scroll without clicking a next button. Well if you have been looking for a good example the Janko at Warp Speed blog has put together a good example using .Net and JavaScript.

Below is an excerpt from the post.


continuous scrollingTypically, user is notified that new content is being loaded by showing indicator in the bottom right angle of a content (as you can see on the screenshot on the left).

Generally, it looks like this: Initial content is loaded on the start. When user scrolls down to the end of the content, JavaScript function calls local WebService and a set of new items is sent back to the client.

Let's make an example. Since I use Google Reader every day, let's make something that looks like it. Ok, I admit, I stole colors for this example :)

This is going to be very simple. I have a list of countries stored in SQL database. Each country has ID, Name and number of Internet users. I would like to show the complete list in a div, and to enable continuous scrolling. Image on the left shows our example.

So, I will define CountryWS that will get the data from the database. This is the first catch and might be tricky. Since new data have to be loaded on request (precisely on scroll) I have to do paging in the database. I do that by sending two parameters to my stored procedure: PageIndex and PageSize. PageIndex will tell my stored procedure which page to query, and PageSize - how many items to retrieve.

[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
public class CountryWS : System.Web.Services.WebService
    public List<Country> GetMoreCountries(int pageIndex, int pageSize)

        SampleDAO sampleDAO = new SampleDAO();
        List<Country> countries = sampleDAO.GetCountriesPaged(pageIndex, pageSize);
        return countries;

That is "the server" part. Let's see what will happen on the client. All items will be rendered in a div that has onscroll handler defined.

<div id="content" runat="server" onscroll="OnDivScroll()">
    <%--Items will be rendered here--%>

OnDivScroll function will do a simple job - it will determine if the user scrolled down to the near bottom of the content. Then it will call CountryWS and pass the result to HandleRetrievedData function.

function OnDivScroll()

    var content = document.getElementById('<%=content.ClientID %>');
    if(content.scrollTop < content.scrollHeight - 500)

    CountryWS.GetMoreCountriesObject(pageIndex, pageSize, HandleRetrievedData );

This is a second catch. Why near? The answer is simple - if you want your user to read smoothly, you'll have to load a new content BEFORE he/she reaches the end of the content. Ok?

And for the end, HandleRetrievedData function will parse the result and render new content.

function HandleRetrievedData(result)
    var content = document.getElementById('<%=content.ClientID %>');

    for (var i = 0; i <= result.length - 1; i++)
        content.innerHTML += "<div class='entry'><b>" +
            result[i].CountryName + "</b> (" + result[i].Symbol + ") - " +
            result[i].InternetUsers + " internet user(s)</div>";

You will notice that sample code is more complex than this example, but I will let you sweat a little bit ;)

You can read the full post here.

Introducing Content Licenses on Google Code


If you host or get code from Google Code then this will be of interest to you. Google code now has the availability of content licenses. This will help promote the best practice of licensing open source code.

The Google Code team is pleased to announce the availability of content licenses for projects hosted on code.google.com. Projects owners may now select from either the Creative Commons Attribution license or the Creative Commons Attribution-Share Alike license to indicate the terms under which their non-source code materials may be distributed.

You can read more about this here.

jqPuzzle - jQuerry Sliding Puzzle

jqPuzzle is a nice puzzle script based on jQuery. The script has some very nice effects using the jQuery library.

You can get jqPuzzel as well as see a few demos here.

What's the Next Big Social Network?


I was playing around with the social networking CMS AroundMe this weekend and this got me thinking of what will the next big social network be. It has been a bit of time since we have seen any really huge social networks pop up and I am wondering what kind of social network would make it big. Lately most of the news has been about aggregation services like FriendFeed or our own BuddyBlend, but I haven't seen much in the new social network space.

As I see it nothing will probably happen in the spaces that huge services already have a strong hold, such as the video space and social bookmarking space. While we will see many new challengers, I don't see anybody beating a site like YouTube any time soon. So, I think that if a new social network is to gain a strong hold it will be in a space where there is no clear leader currently.

Below are the spaces that I think that there is a chance for a new social network to dominate.

  • Video Game Space
    While there are currently a few Video Game social networks, there is not yet a MySpace for gamers. I think that in order for a site to clearly win this space they will need to provide on-line games, a space for gamers to talk about their favorite games and a place schedule on-line games.
  • Music Space
    While there are a few sites that are in this space, with last.fm leading the pack, I'm not sure that there is a clear winner in this space. The tough thing in the Music Space is the copyright information if you share music. What I think needs to happen for someone to dominate this space is they need to make a deal with the record labels like iTunes has where perhaps I can listen and share music for free on the site, but if I want to download it to my iPod I need to pay a very small fee.
  • Athletics Space
    I haven't seen many good sites in this space, but think that with so many sports fans that this could be a huge space if done well. Just think of the amount of people in this audience all over the world!
  • Collectible Space
    This would be a place where people who collect items, whether they be baseball cards or cars, could connect with people that have the same interests. I haven't seen any social networks in this space, probably because of ebay, but I think there could be a large social network in this space.
  • Outdoor Activities Space
    I haven't seen many sites in this space, but with so many people enjoying outdoor activities, this could be a huge social network. Just think of a social network where you can share and find your favorite camping sites or places to go rafting.

This is just a small list of possible spaces where the next great social network will exist. I would love to hear your thoughts on the space where the next great social network will exist.

Web Based Document Viewer


AJAX Document Viewer www.ajaxdocumentviewer.com
Ajax Document Viewer is a web based online document viewer and can embedded into any web page or linked from any page. It is fast, customizable and FREE.
Are you having problems displaying documents, pdf's, images, word documents? Do your customers have to download a reader to view a file? Do you need a fast pdf reader? Do you need a universal viewer for any kind of documents?

All these problems go away by using Ajax Document Viewer.

For most companies, getting software products to market on time, on budget, and with the right features and functionality is always a challenge. But it doesn't have to be.

Syndicate content