Lighter, Faster: Using Table Controls in Non-Editable Mode

Follow

Overview

The Brazos UI Table control has a configuration option to display as non-editable. Using Read Only mode comes with a performance boost but there are a few quirks to keep an eye out for.

Background

The Developer and Enterprise Editions of Brazos UI have identical Table controls. The Table can:
  • Display extremely large data sets using pagination or infinite scrolling (tested with 1,000,000 rows of data in the data source).
  • Filter displayed data through user inputs.
  • Filter displayed data via other data/controls on the page.
  • Sort data by single or multiple columns.
  • Load data through AJAX calls and on-demand.
  • Export table data into CSV files.
  • Fire boundary events.
  • Update column visibility dynamically.
  • Utilize single select, multi-select, or select all options.

In light of all of those features, the ability to set a table to be non-editable seems like a trivial addition to the Table's feature set. However, this configuration option allows for the table to be light-weight and fast, a handy feature when also leveraging the above options on large data sets.

Editable/Read Only Configurations

By design, a Table control dragged off the palette is configured for editable data. To change the Table to Read Only mod use the following configuration option:

  • Table: Properties > Configuration > Advanced > Table Mode dropdown

Behind the scenes, underlying behaviors of table are changed when the Table Mode is changed but from the designer's perspective very little needs to be changed.

Speed Advantage

Tables are obviously useful for capturing information from users and sequential editing of a number of related records. They are also frequently good options for simply presenting information to users. When set to be non-editable, the Brazos UI Table control utilize a significantly smaller memory footprint. How they render is also altered which results in faster loading and updating of the table. All Brazos UI controls are designed to be fast and efficient, but no other control is likely to need to handle the same quantity and complexity of data as the data table will. The editable Table will handle what you throw at it, but when you need to squeeze out even more performance and decrease the client-side load, the Read Only table mode is the best choice. Therefore, when tabular data only needs to be presented to users, we recommend setting the Table to be read-only. 

Quirks

Despite the advantages of the non-editable table, it may not be suitable for every use case. The most notable "gotcha" to watch out for is when using complex controls within the table. In order to maintain the light weight and fast nature of the table certain controls such as buttons and modals are simplified when included as part of a non-editable table. What that means behavior-wise is that certain controls can't be customized on a per-row basis. For example, buttons must display the same text in each row.

The editable Table control is still very fast so don't shy away from using the Table control in editable mode when you need complex components in your table. The editable table is designed to render whatever you need, so are still great options when you need "form over function."

Other Tables

Brazos UI previously had three types of table controls: the Table of the Lite version and the Table and Data Table of the Enterprise version. The Lite version of Brazos UI has been retired in favor of the Developer Edition. The Lite table exists in the current editions of Brazos UI as a deprecated control to make upgrading easy. Both the Developer Edition and Enterprise editions offer identical table controls but for simplicity the Data Table control has been deprecated in favor of the Table control since both tables ultimately offered identical features and functionality.

Have more questions? Submit a request

Comments

Powered by Zendesk