Application Design

One of the critical phases of software design is application design. When designing your application, it's important to consider the following:

• What are the end-user requirements?
• What tasks will the user need to accomplish?
• What is the work flow?
• How easy is the application to use?

Application design includes application architecture, user interface design, and component design. If this phase of application development is neglected, usability and performance can be adversely affected. For example, poor performance can occur if the application has a poorly designed, complicated user interface and if the application uses components that aren't designed properly. While designing your General Interface application, consider the following best practices.

Design Applications to be Asynchronous

Whenever possible design your application to use asynchronous loading to improve performance and usability. Use the following techniques:

• Load only those areas of the application that are viewable by the user and required for the user to begin using the application. For example, load the tab content for the first visible tab and load content of other tabs only when the user selects the tab.
• Specify an appropriate load type for your GUI components, such as Paint Asynchronously, Deserialize Asynchronously, and so on. For more information, see General Interface Component Guide.
• Load GUI components using Referenced - Asynchronous. For more information, see Component Hierarchy Palette Context Menu.
• Load XML data sources asynchronously. For more information, see General Interface Component Guide.
• Load resources asynchronously
  
  • Asynchronously load JavaScript files using the jsx3.app.Server.loadInclude() method
    
  • Asynchronously load an XML document and store it in the local data cache using the jsx3.app.Cache.getOrLoadAsync method
    
  • Asynchronously load an XML document using the jsx3.xml.Document.setAsync() method
    
  • Issue a request asynchronously by passing bAsync=true to the jsx3.net.Request.open() method
    For more information, see General Interface API Reference.

For more information, see General Interface Component Guide.

Reuse Existing Components

Loading complex components can be one of the most expensive operations. Reuse components whenever possible instead of removing and recreating General Interface DOM nodes.

There are typically two use cases for reusing components:

1. Changing component properties reuse a component by simply changing a property programmatically, such as a column header or cell width.
2. Showing components intermittently if a component is used intermittently, such as a dialog or a tab, show and hide the component instead of destroying and recreating. However, remember that repainting a component repaints all children, even if they're hidden.

Don't Store Data in Form Elements

Storing data in form elements, which is a typical HTML pattern, is not recommended for General Interface applications. Instead of hiding and showing form elements to access data, persist data separately in an XML/CDF document or JavaScript variable. Note that persisting data as XML is recommended, because memory management for XML is better than for JavaScript objects. Once data is persisted, load and unload components as needed without losing data. For example, persist login and username data from a dialog and remove the dialog from the General Interface DOM instead of hiding the dialog.