To manage page loading, the client-side router must:
Provide a means of manipulating the browser URL, without causing the page to be automatically loaded.
Detect requests for arbitrary URLs (for example, clicking the back or forward button), hijack those requests, and manage the responses to them.
Detect requests for specific URLs (for example, clicking a product link), hijack those requests, and manage the responses to them.
Normally, when a page link is clicked or a form is submitted, the current page is unloaded and a new page is loaded. Unloading the page means that all state associated with that page, including the HTML markup, CSS and JavaScript state, is destroyed and must be rebuilt for the next page that is loaded. Commerce Store Accelerator circumvents this normal flow, allowing the state to be preserved and the application developer to control what content is loaded for the new URL. To circumvent the normal flow, Commerce Store Accelerator uses a combination of the following:
Extended versions of the History API’s
history.pushState()
andhistory.replaceState()
functions, defined in/CommerceAccelerator/Base/src/main/web-app/history.js
script.An instance of the Crossroads router, created by the
/CommerceAccelerator/Base/src/main/web-app/router.js
script.