Client Binding

Breakthrough VirtualRendering™ technology

VirtualRendering™ is Intersoft’s state-of-the-art client rendering framework which enables WebGrid to render data rows efficiently, while at the same time delivering identical user interface as in server-side rendering.

The uniqueness of Intersoft’s rendering technology lies in its ability to perform rendering with very minimum overhead. This is made possible with sophisticated state management that automatically synchronizes its current state as user interacts with the Grid. The row is rendered based on “delta algorithm” to produce high rendering quality in superior performance.

One of the outstanding achievements of VirtualRendering™ is its small size of the client scripts required to activate the client binding feature. Unlike traditional approaches which can take almost half a megabyte, WebGrid 7 adds only as little as 60KB for data binding processing, data shaping and rendering.

The main benefit of client binding compared to the traditional server-side binding is the smaller data footprint. When operating in client-binding mode, WebGrid returns raw data in JSON format which is much more compact than the traditional HTML markup. In various tested scenarios, WebGrid has been proven to reduce data footprint consistently by over 90%.

Rock-solid Client Binding framework

High-performance client data processing

Intersoft’s Client Data Object Framework can be illustrated as a lightweight, mini version of Microsoft’s ADO.NET Framework. Client Data Object Framework will be further called CDOF in the following section.

CDOF includes client-side implementation of DataSet, DataTable and DataView – which acts as the backbone of all client-side data operations in WebGrid. The ISDataSet and ISDataTable represent the main data object which is then used by WebGrid for further processing such as data shaping, formatting, paging and more.

The following illustration describes the overall client binding processing in WebGrid.

As shown in above illustration, WebGrid relies on CDOF to obtain finalized data shape, which is then processed further by VirtualRendering™. This unique architecture model enables clean separation between data abstraction layer and rendering layer – making it easy to be consumed by WebGrid and other WebUI Studio® family which requires client binding implementation in the future.

Easy programmability through new client binding API

A new set of client-binding APIs is introduced for programmatic consumption of the feature. Most of the user interface functions and high-level encapsulation of binding process called the same underlying APIs. Please refer to WebGrid’s online documentations for complete list of new methods and client-side events.

Rich Client-side Data Processing

In addition to provide solid client binding platform, Client Object Data Framework (CDOF) also enables many client-side data processing operations which were previously difficult or not possible.

The following lists the key features of client-side data processing:

  • Client-side data formatting

    It supports composite data formatting such as string, date time and number formatting and also takes account of Culture information. You can consider it as a client-side implementation of .NET Data Formatting Library.

  • Client-side sorting

    CDOF implements high-performance client-side sorting that is capable to sort multiple columns in a fraction of seconds. The client sorting is implemented at data access level instead of UI level – enables developers to have greater control over data shaping process. The sorting feature is implemented at ISDataView class.

  • Client-side filtering

    CDOF features comprehensive filtering support which enables developer to easily perform row filtering at data object level. The client-side filtering implements syntax that is fully compatible with server-side ADO.NET Framework’s filter expression – making it easy for .NET developers to consume client-side filtering features.

  • Client-side paging

    Since the data-shaping process lies in the client-side, it enables the paging to be processed in client-side as well. Client-side paging is fairly easy to be implemented at control/UI level, as long as final data shape is made available. WebGrid 7 implements client-side paging in its own process to support more comprehensive paging options such as VirtualLoad™ and Classic™ paging, as well as to gain better control over the paging process based on various data source types and scenarios.

Flexible data loading mode

WebGrid 7’s ClientBinding™ includes two type of data loading mode for client-based data service, regardless of the paging mode of WebGrid in User Interface level.

  • AllData

    If your data service is designed to return all data, then you should choose AllData as the value of DataLoadMode property.

  • PagedData

    PagedData option is very useful under certain scenarios when large amount of data is used. It enables you to retrieve only partial data for the current view.

    Intersoft’s ClientBinding™ introduces a unique approach which enables you to easily retrieve paged data in your data service. ClientBinding encapsulates essential select arguments into an object called DataSourceSelectArguments. This object is always passed to the parameter of your Select method, enabling developers to easily perform data selection based on the information.

    When data operation – such as sorting and filtering – is performed in PagedData mode, WebGrid will send a request to the specified data service by including complete request data in the selectArguments parameter. Developers are responsible to handle the sorting, filtering and paging based on the select arguments. In addition, WebGrid will also send a SelectCount request when it needs to invalidate the paging status.

Transaction operations and service events

Elegant transaction operations

ClientBinding™ fully supports transaction operations for data service types – as elegant as in data selection process. It handles the complex serialization and deserialization process automatically. As a result, you can develop your transaction methods by accepting the original and new item object. You need to set the corresponding object name in ItemTypeName property, and provide the class structure of your object in the client-side. WebGrid 7’s transaction operations work best with .NET Framework 3.5 data access technologies such as LINQ to SQL and ADO.NET Entity Framework.

Elegant transaction operations

Extensible service events

All data operations in data service are powered with a solid, provider-based architecture that is highly extensible and scalable.

Client data services that supported by WebGrid 7 such as WebService, WcfService and AstoriaDataSource inherit the same data source provider base. As a result, these data services share the same process life cycle, same events and behaviors.

For more information on the complete list of client data service, please refer to WebGrid’s online documentation about service event in WebGrid Enterprise 7.

Extensible service events

Comprehensive “Cloud”-ready data service

Server-side data source

Server-side data source is the quickest and easiest way to take advantage of client-side binding as WebGrid automatically connects with the datasource control and automatically repackages the data into lightweight format and transmits it to client-side for further processing.

The supported server-side data source are all data source controls (AccessDataSource, SQLDataSource, LinqDataSource,etc) and data source object, which is assigned in InitializeDataSource event (also known as Traditional Binding).

Server-side data source

Service-based data source

WebService data source type enables you to connect WebGrid to a web service, such as Windows Communication Foundation (WCF) Service, which is done through properties configuration. It will automatically activate the full client-side operation mode when your data service returns all data. It also supports paged data retrieval for optimized performance.

It is also possible to perform data transaction operations such as insert, update, and delete as well as advanced operation such as batch update when connected to web service.

Service-based data source

Astoria or ADO.NET DataService is the latest data access technology shipped in .NET Framework 3.5. It enables data to be consumed programmatically through standard web protocols, such as: REST, SOAP, XML, and JSON. WebGrid Enterprise 7 is optimized to fully support ADO .NET DataService and consumes it in the same manner as other web service technology. You only need to specify the service address in ServiceUrl property.

ADO.NET DataService enables programmatic data access over the Web with very minimal efforts, which includes support for sorting, filtering and paging. It also includes native support for data transactions such as insert, update, delete, as well as more advanced operation such as batch update.

ClientBinding™ fully takes advantage of Astoria capabilities and implement direct interface to access Astoria’s functionalities. As a result, you are not required to specify any of the service methods.

However, the current ADO.NET DataService doesn’t support complete paging feature yet. You will need to use the AllData mode when using AdoDataService type.

Client-side data source

The ability to fetch the data from any custom data source in client-side is extremely helpful in certain scenarios where you need to retrieve the data from external sites or data services which is not supported by WebGrid’s ClientBinding feature. For example, you may have a requirement to fetch data from an external site manually in the client-side, and then pass the resulted data to WebGrid via API calls for data binding.

Pure client-side binding takes as little as three lines of code, such as shown in the following:

grid.SetDataSource(dataSource);
grid.DataBind();
grid.Render();

WebGrid accepts ISDataSet, ISDataTable or any array-based collection as data source.

Client-side data source

High compatibility and configuration

Works in concert with the new SmartBatchUpdate™

Build with solid architecture, WebGrid is designed to fully support every WebGrid’s features, which includes the SmartBatchUpdate capability.

SmartBatchUpdate is a major feature introduced along with client binding in WebGrid Enterprise 7 which revolutionizes the editing experience with multiple and batch editing in client-side and process the all edited data in one single AJAX callback. This new batch update feature also supports batch update operation in data service.

Works in concert with the new SmartBatchUpdate™

When batch update feature is enabled and the client binding mode is using data service, WebGrid will automatically submit all changes by invoking the web method specified in BatchUpdateMethod.

WebGrid submit all changes in an object collection of List. In your data service end, you can easily loop on the provided changes collection, and perform physical update according to the modification state of each change.

Full compatibility with existing key features

As a future proof technology to deliver even more sophisticated web applications, WebGrid’s client-binding is designed to maintain high compatibility with other existing features. However, there are certain conditions which this enhancement is not applicable due to behavioral collision.

Full compatibility with existing key features

WebGrid’s client-binding is enhanced to work in conjunction with the following WebGrid features:

  • All columns and UI operations features, such as: drag drop, context menu, etc
  • All layout features, such as: border, gridlines, alternating style, etc
  • WebGrid’s fundamental features, such as: edit type, data formatting, custom editor, etc
  • Sorting and multiple sorting
  • Grouping and multiple grouping
  • Filtering and multiple filtering
  • Column footer, group total, and aggregation
  • Classic paging and VirtualLoad paging
  • Custom tag serialization which enables you to send custom information along with the data row to the client
  • All data transaction operations
  • SmartBatchUpdate™
  • LiveFreeze™
  • Pivot Charting

Virtual Group Paging

Group Row Paging

Built on the top of VirtualLoad™ architecture, the new group paging feature enables partial group rows loading which dramatically improves user experiences in large data group scenario. This feature is designed to work with Client Binding to improve the scalability of cloud-based application.

With group row paging, WebGrid retrieves only a subset of child rows at a time and loads the next rows on demand when requested. This significantly improves overall application responsiveness by reducing data transfer size and making efficient use of client resources.

A new user-friendly visual hint is also introduced when group row paging is enabled, allowing users to easily understand the current state of the group row. The new group status bar provides information about the currently loaded rows, the total available rows and group-related commands.

WebGrid now takes only a fraction of second to expand a group of 1,000 rows, which is about 15 times faster compared to the original mode without paging. Thanks to its rock-solid and highly scalable architecture, this new group paging feature works flawlessly with other key features such as data editing, batch update, row selection persistence, and more.

Group Row Paging

Preload Group Totals

With Client Binding, WebGrid processes data binding operation in the client-side, from rows and cells population to data rendering and aggregate computation. When the group totals feature is used with Client Binding, the data aggregate processing could be heavier in the client-side especially when the Grid is bound to a relatively large dataset. In most cases, the data aggregate is better computed from the server-side or back-end directly to balance the overall performance in the client-side.

The Preload Group Totals feature is introduced to enable data aggregate process to be computed from the server-side while retaining the benefits of Client Binding. This feature works by preloading the group totals during initial server-side data retrieval and send the results to the client-side along with the data rows object, thus reducing the client-side workload and ultimately increase overall user experiences.

This new feature is also designed to work in concert with VirtualLoad™ paging – allowing users to see all group totals without the hassle to expand each group to retrieve the rows.

When using ServerDataSource type, the group totals will be automatically computed without additional codes. Simply enable the PreloadGroupTotals property under ClientBindingSettings to activate this feature.

Preload Group Totals

VirtualLoad™ Support for Web and WCF Service

The VirtualLoad paging and grouping capability are now enhanced to fully support Web service and WCF service. WebGrid will automatically send a new SelectGroup option in the select arguments when it attempts to perform grouping, or perform data selection in grouping conditions. This will allow developers to handle the group retrievals based on the select operation mode in the server-side and return only the groups information to the client.

The combination of VirtualLoad paging and grouping technique enables up-to 4x faster performance and more efficient resource consumption compared to ServerDataSource. This achievement is possible since developers have more granular controls over the data selection process, and in this case, selecting only the groups from the backend directly without have to process the data rows.

Previous Next