Client Framework

Client OverviewThe Backbase Client Framework is a standards-based, server independent solution to creating web applications, ranging from traditional to desktop-like. It uses AJAX technologies to easily develop and deploy Rich Internet Applications.

The Client Framework is based on AJAX and web-based technologies that offer an enterprise-grade environment to develop standards-based code in both declarative and functional programming models, which is capable of running seamlessly in all major browsers. Developers can use the Client Framework as an extension of XHTML, a JavaScript toolkit, or a combination of both. Developing Rich Internet Applications using the Client Framework is simplified, because you can design your web applications in an object-oriented way, and use a model-view-controller architecture to make your application maintainable and extensible.


Performance Tuning

The main challenge of using the Backbase framework to develop web applications is to balance the client-side logic with server-side logic. Rich Internet Applications (RIAs) require more logic on the client, but putting too much logic on the client-side can be a disaster for performance. This pages aims at providing some hints and tips to avoid overloading the client.

The Backbase client framework uses the MVC model and it will create three types of nodes instead of one for every Backbase element:

  1. HTML DOM nodes in view space
  2. Model nodes in model space
  3. Controllers as Javascript Objects that match elements in view space

The benefit of two extra nodes is adding object oriented features and this allows increased development productivity. However, maintaining many controller objects could be quite expensive and thus affect performance.

The goal should be to achieve maximum performance given the business requirements and technological constraints. Backbase has thought about these issues and provides specific techniques to improve performance.

Telamon Visual Ajax Builder Beta sent to Early Adopters

Telamon Beta

The development of the Visual Ajax Builder – code name Telamon – is moving on quite nicely. This week we’re sending the Beta version of the Telamon Visual Ajax Builder to the people who pre-registered over the past months. Based on their feedback we’ll make further improvements and distribute the Beta to a wider audience. If you weren’t on the Early Adopter list, please register for the second phase of the Beta program, and we’ll contact you once it’s available.

For those who are in the early adopter program, please view the Getting Started video

Introduction to remote dataSource with listGrid - Part 2

This example page introduces paging and sorting for a listGrid using a remote data source.

This example is part 2 of a series of introductory examples about remote data sources. It builds upon the Introduction to remote dataSource with listGrid.

Backbase in Visual Studio 2008 Express in 1 Minute

Evgenios Skitsanos wrote an interesting blog article that explains how to use Backbase with Microsoft’s free software development tool called Visual Web Developer (VWD). It uses the Backbase XML Schemas to enable code completion inside VWD (intellisense). VWD is then aware of the Backbase-specific tags, and will provide a list of available tags as you type, just like it does for HTML and JavaScript.

Read the blog post »

Read about Visual Studio integration on the BDN »

Introduction to remote dataSource with listGrid - Part 1

The objective of this example page is to explain how to set up a remote data source for a listGrid widget. For practical reasons we have chosen PHP 5 as our server scripting language. We hope that the code is clear enough to be understandable if your preferred language is not PHP. The database that contains the data for the remote data source is a SQLite3 database. Minimal changes to the code are needed to use the code for a MySQL database.

Backbase & ASP.Net

ASP.Net logo

This example will demonstrate how to combine the Microsoft ASP.Net Server-Side Framework with the Backbase Client Framework. It will focus on making the adjustments required for integrating ASP.Net WebForms and UserControls in a Backbase-enabled AJAX application. It does not demonstrate how to create an AJAX application. If you are interested in seeing this code in action, please read the Creating an SPI with Backbase and ASP.NET tutorial. For more information on Ajaxifying existing ASP.Net applications, please see the Progressive Enhancement of ASP.Net applications tutorial.

Using ASP.Net in a Backbase SPI Application

Normally, ASP.Net applications are typical Multi Page Interface (MPI) applications. However, with some small adjustments, it is rather simple to create a single page web application using standard ASP.Net components. For a technical explanation of the inner workings of the required adjustments, please read the Backbase & ASP.Net tutorial.

Microsoft Visual Studio Intellisense for Backbase tags

Every .NET developer should be very familiar with Visual Studio as their development environment. Wouldn’t it be nice if you could use it for all of your Backbase XML editing including its IntelliSense features? This article shows you how to do this.

Progressive Enhancement of ASP.Net applications with Backbase

Many ASP.Net developers are faced with the following problem: people around you (customers or managers) are telling you website "X" has cool feature "Y" and they want you to include it in your websites. Usually this is about Rich Internet controls. However, replacing those controls is not always simple, since you are ‘stuck’ with the standard ASP.Net control set with no or limited dynamic behavior.

Backbase Data Binding and ASP.Net

Data binding is one of the most powerful features of ASP.Net and Visual Studio. You can literally create an application with controls that are data bound to a database with only drag-and-drop and using simple wizards. However, with AJAX features your web application could refresh just its data instead of the whole page. Visual Studio does not offer much support for these more advanced features. This article will explain how to use Backbase data binding in combination with Visual Studio data binding.

Client Edition 4.2.1 Released

We are proud to present a maintenance release of the Client Framework: Backbase Client Edition 4.2.1. We strongly recommend upgrading to 4.2.1. It can be downloaded at http://www.backbase.com/download.

The documentation is available on the BDN, and in the Release Notes you can find a detailed overview of the changes. Below is a short overview of what's new.

Complex Widgets

The Client Framework provides a binding language called Tag Definition Language (TDL), which is XML compliant and has its foundations in object oriented programming languages. It provides a set of elements and attributes required for the creation of new widgets or tags. TDL serves as a means to bind classes to document-level markup elements. Our implementation of XHTML and all of our Backbase Tag Library (BTL) widgets are constructed with the TDL.

Performance Optimization for Backbase Applications

The performance of Backbase applications can easily be improved with general web development best practices, such as pioneered by Yahoo!’s Exceptional Performance team. In this article I’m outlining the most important optimizations, including some Backbase-specific hints. After you’ve developed your Backbase application there are several things you can do to improve the client-side performance without changing the functionality of the application. Let’s look at the optimizations one by one.

Hello Server (Asynchronous)

To many people, AJAX is almost synonymous with XMLHttpRequest, the API that allows client programs to communicate asynchronously with a server. This example page shows the Hello World example for AJAX communication using a Backbase form.

Hello World - Part 2

This example builds upon the Hello World - Part 1 example. It shows how to create a Backbase Tag Library (BTL) Balloon, which is filled with custom text.

The example is done twice, to show that BTL can be coded in two ways, either exclusively using JavaScript, or using no JavaScript at all. The second version of the example uses the Backbase-specific XML Execution Language (XEL) and Commands instead. Any combination of these two styles is also possible as many examples in the Backbase documentation will show.

XEL Keyboard Events

This tutorial shows you how to handle keyboard events with the XML Execution Language (XEL), which is a declarative programming language delivered by Backbase to facilitate the creation of application functionality without the use of JavaScript.

Hello World - Part 1

This example shows how to create a simple Hello World! application using the Backbase Client Framework.

Javascript HTML Construction Benchmark

DOM vs. innerHTML

A while ago I did some experiments on creating an XML document by constructing a string versus creating it by using the DOM methods, and I found that the latter was faster than the former. QuirksMode by Peter Paul Koch has a Javascript benchmark for creating HTML however, which claims that using innerHTML is 35 times as fast compared to using the DOM (although I can’t reproduce that number in Internet Explorer 8 (IE 7 mode), it is ‘only’ 22 times faster here).

Create a Simple Widget

This example will show how you can create a widget (more generically, an element) using the Backbase Tag Definition Language (TDL). The example will not go deep into the matter. For more details on widget creation, refer to the Widget Development Guide and the Reference.chm.

Consistent Browser Display

A common design requirement for a web application is that the application should, so far as possible, look and behave the same in different web browsers. While not essential, having an application that looks and behaves identically irrespective of the browser offers a number of benefits. For example, users that use an application in different browsers (home and work) will be more productive, and documentation and support requirements will be reduced.

SOAP Message Communication

This tutorial guides you through the process of how to work with Backbase to create and communicate Simple Object Access Protocol (SOAP) messages to a web service in JavaScript and in the XML Execution Language (XEL).

Create a History Manager

This tutorial shows you how to use the history and bookmark mechanism in order to create your own history manager.

It is a well-known problem when creating a Rich Internet Application that pressing the Back and Forward buttons may not cause the result that the user intuitively expects. The Backbase Client Framework provides a History Manager, which allows you to record user interactions and provides the user with the possibility to retrace his or her actions by pressing the Back and Forward buttons in the same way as for a Multi Page Interface.

Using the fieldEditor to Define a Grid Column Editor

This example demonstrates how to use the fieldEditor element to customize how data inside a grid is edited.

Introduction to the dataSchema and dataField elements

This example explains how to use the dataSchema and dataField elements to create an interface or mapping between a data source and a data consumer, such as a Backbase Tag Library (BTL) listGrid. The use of such an interface makes it possible for a single data consumer to use data from different sources and can significantly reduce the maintenance overhead in applications where the same data source is used by multiple consumers. The formatting capabilities of the dataField element are also explained.

Introduction to the treeGrid

There are several ways to display data in XHTML. All of them are relatively simple, are not interactive and the data can not be edited. Using the Backbase Client Framework this can already be improved partially by, for example, adding sort functionality to a table. However, this may not be enough for the features that are required in an application. The Backbase Tag Library (BTL) contains widgets that offer built in solutions for the more advanced features that are required, like sorting, column resizing and editing. One of these widgets is the treeGrid.

Using the fieldCreator to Customize the View Inside a Grid

This example demonstrates how to use the fieldCreator element to create dynamic cell content, and how to ensure that the content remains synchronized with the data.

Binding to a Remote Data Source (PHP)

This example page explains how to display remote data in a grid using a PHP script as the data provider and XML as the communication format.

Integrating Google Gears with Backbase

One of the great advantages of Backbase is that it easily integrates with third-party widgets. In this example, we will demonstrate how you can combine Backbase widgets with the Google Gears library.

This example uses the context of a simple alarm application to showcase several useful techniques for creating Backbase applications:

Integrating Google Maps with Backbase

One of the great advantages of Backbase is that it easily integrates with third-party widgets. In this example, we will demonstrate how you can combine Backbase widgets with the Google Maps API.

Integrating Yahoo! UI Widgets with Backbase: Color Picker

One of the great advantages of Backbase is that it easily integrates with third-party widgets. In this example, we will demonstrate how you can combine Backbase widgets with the Yahoo! UI widget library. In particular, we will implement the Yahoo! Color Picker to allow users to change the color of the Backbase chameleon skin using the Backbase skinSettings widget.