Dec 06

Data Tables, an unexpected browser stress test and a surprising winner

The venerable HTML table, although less used than it once was, has still its place, especially when showing, well, tabular data. Recently, whenever there is has been a need has to use tables with column sorting, searching or having tables with fixed headers or columns, Data Tables has been of great use. Data Tables is an excellent, flexible and versatile jQuery plug-in, authored by Allan Jardine of SpryMedia, that I can strongly recommend to anyone needing to use tables in a web app.


An example of the use of Data Tables in the CFOlytics financial management web app.

While working on a recent web project with Data Tables, we found ourselves in a situation where a table with around 900 hundred rows had to be displayed and, in our first try, paging was not an option – the plug-in allows the use of both vertical and horizontal scrollbars, enabling an experience that is somewhat similar to Excel, so this high number of rows wasn’t really an initial concern. Having used the plug-in in similar circumstances before (although not quite with as many rows), we weren’t expecting any unpleasant surprises, in terms of browser behavior.

The first test with Chrome confirmed a previous experience – data download wasn’t a problem, time wise, but getting the browser to display the table was another matter altogether. Chrome took its time to display the data, probably 3 to 4 times the amount of time needed to get the data from the server using Ajax. IE was next in line for testing and we started with IE 11 on Windows 8. Surprisingly, or maybe not, 3 out 4 times, IE couldn’t handle the table without crashing. IE 10 on Windows 7 was even worse. Not only did it crash as well, but when it didn’t, the table didn’t display correctly. The good surprise was left to the end. When we tried the page with Firefox, the page display correctly, but performance was clearly better than Chrome or IE. With Firefox, the response time, both in terms of download and display was perfectly acceptable.

These results were a bit surprising. I definitely didn’t expect to see Firefox beating Chrome in Javascript performance in a such a clear way, but it did. Firefox lost a bit of its luster to Chrome but, at least to me, this specific situation made me rethink the way I looked at Firefox. As to IE, it seems that no matter how much Microsoft tries to advertise as a fast, reliable browser, every day use shows it still lacks the robustness its rivals show – even considering this is a very specific situation and we didn’t mean this to be a test in browser performance. However, my own experience helping users on the Windows Secrets Lounge, shows that IE still lags behind its major competitors in reliability.

As to the situation that brought about this unexpected browser performance test, we solved the problems that prevented us from using Data Tables paging features, so the use of paging ensures a good behavior from all modern browsers while displaying the table in question.

Dec 01

My links of the week – December 1, 2013


Here are my chosen links for this week, covering SQL Server (with an emphasis on SQL Server 2014), web development, software development and big data.

  • Web Design and Development:
    • Victor Savkin’s Contrasting Backbone and Angular is an interesting article that compares how regular web development tasks can be achieved with the Backbone,js and Angular JS Javascript frameworks.
    • Steven Bradley’s Mobile Up, Widescreen Down, or Somewhere In-Between? compares the mobile up and widescreen down approaches, when designing a responsive website and provides advice on which to use considering the designer’s experience.
    • Rob Dodson’s A Guide to Web Components addresses Web Components, a set of web standards with the goal of allowing the bundling of markup and styles into custom HTML elements, that fully encapsulate the HTML and CSS. An excellent read.
    • Mike Wasson’s Single-Page Applications: Build Modern, Responsive Web Apps with ASP.NET shows how to build a Single Page Application (SPA) using Visual Studio 2013 and the ASP.NET Web API, while using Knockout.js and Ember.js for the front-end. 

That’s it for this week. Thanks for reading.