w10 - single page app Flashcards
Single page apps
Single-Page Applications (SPAs) are Web apps that load a single HTML page and dynamically update that page as the user interacts with the app. In other words, in Multi-Page Applications (MPAs), the server responds with HTML files with each request. The client (such as browsers) has to render the whole page again. Sending a new HTML file might also include its static assets such as CSS, JS, and png files.
Disadvantages of Single Page Applications
History: Browsers such as Chrome store history so that web pages load quickly when users hit the back button. The back button takes you to the previous page, not the previous state (Component) of your app.
Loading CSS and JS: SPAs might get higher booting time as they have to load most of the assets in advance.
Analytics: Analytics tools track page views by default, not components or app states.
Security: Part of the web app engine will be on the client side.
Routing & Navigation
The Angular Router enables navigation from one view to the next as users perform application tasks. In most web applications, users navigate from one page to the next as they perform application tasks. Users can navigate in these ways:
Entering a URL in the address bar Following links, clicking buttons, and so on Going backward or forward in the browser history
Router imports
The Angular Router is an optional service that presents a particular component view for a given URL. It is not part of the Angular core.
Adding leading slash to path in router?
ach Route maps a URL path to a component. There are no leading slashes in the path. The router parses and builds the final URL for you, allowing you to use both relative and absolute paths when navigating between application views.
Does the order of router config matter?
. The router uses a first-match wins strategy when matching routes, so more specific routes should be placed above less specific routes. In the configuration above, routes with a static path are listed first, followed by an empty path route, that matches the default route.
routerLinkActive and routerLink
<a>List </a>
Angular pipes
Angular pipes are functions that are used to transform data in Angular templates.
These functions take input data values, transform/process them and return a single output value.
PWAs
Progressive web apps (PWA) are web applications that are capable to give users an experience similar to native apps.
Adv of PWAs
installable: can be installed locally ( works offline)
progressively enhanced
responsively designed: it works on multiple platforms such as desktop, mobile, and tables
discoverable: can be discovered by the search engines
network-independent: it works offline
secure: much more secure than ordinary web applications