Static Vs Dynamic Web Applications
Users intuitively expect traditional static websites and web applications to behave differently. A developer cannot create an optimal user experience without having a clear understanding of the differences.
- Static Vs Dynamic Apps
Static vs Dynamic Web Application Behavior
WebRocketX can be configured to run in one of two modes, either as a static single page web application or as a dynamic
single page web application.
Originally the world wide web only consisted of static web applications, where the web page a user looked at would not change unless a developer uploaded a new page. Users expect static web applications to be navigated very simply and expect the back and forward buttons on the browser to take them exactly where they were previously. This means that even if the user navigates in circles visiting one page over again with another page in between, they expect the back button to also navigate in circles, unrolling through every place they visited. WebRocketX running in static page mode behaves in this way. It also supports the refresh button, and bookmarks to any page in the website.
Dynamic web applications, on the other hand, behave like desktop computer applications. Every time a page is viewed it can look different depending on what data is loaded into the page. This means that the page has a memory state that is dependent on how the user interacted with it. Therefore, dynamic web applications do not support circular navigation. Instead they are navigated like the branches of a tree. So, for example, when the user returns to a previously visited page in a navigation flow, through a forward type action such as a hyperlink, it is still a type of back, so their navigation history is pruned to that point in the flow. Furthermore, clicking the browser back button in a dynamic web application will always take the user closer to the "trunk" of their navigation, which is not necessarily where they just navigated from. WebRocketX automatically creates this type of navigation behavior for the developer by using its navigation stack.
The API for dynamic mode has many more methods than static mode, to support all the types of things that can be done in a dynamic web application. Static mode only has one method. For more information on all the things that can be done in dynamic mode, visit the Dynamic App Tutorial through the main menu.
Dynamic mode does not support the browser refresh button, so when it is pressed the user will be returned to the welcome page. The reason for this is that in this type of application a memory state can be accumulated across navigation through multiple pages and when the user presses the browser refresh, they completely wipe the browser side memory clean.
Dynamic mode also does not support the browser forward button, so it is ignored. This is because the back button always navigates toward the trunk of the users flow which results in the memory state of the forward being pruned from the navigation stack. Therefore, there is nowhere to go forward to.
Dynamic mode does not by default support bookmarks to internal pages in the application. Users always have to enter through the welcome page, because the welcome page is the only page that contains the elements necessary to run the framework. Static mode also has a welcome page but supports bookmarks by jumping from the welcome page to the reference page in its bookmark, upon entry into the website. Dynamic mode cannot support bookmarks by jumping to them like this because any of its pages can be multiple navigations deep and therefore multiple memory states deep. These memory states are dependant on how the user interacted with the application, while navigating, so dynamic pages cannot be jumped into from the welcome page. The record of how a user previously got to that internal page, simply does not now exist when a user comes in from a different website using a bookmark.
WebRocketX running in dynamic mode can be coded to do a single page jump to an internal page from its welcome page if so desired. The developer simply needs to register a page ready event on the welcome page that looks for the presence of an internal id, in the hash of the bookmark. The code in the event then does the navigation using the id from the bookmark. This kind of behavior is desireable for e-commerce sites where the bookmark could contain the identifier of a product for sale.