Web App metrics in UI Architect Stand point - Security, Performance, Offline PWA, Accessibility, Early loading-PRPL, SSR

External Validation, coding less

--------------------------------------

1.Security: OWASP , SQL injection, XSS, XSRF,  

2.Performance Testing: light house Web page test- chrome extension to validate 

1.First Contentful Paint 2.Time to Interactive 3.Speed Index 4.Total Blocking Time 5.Largest Contentful Paint 6.Cumulative Layout Shift
• Performance – time to interactive, latency, speed index, resources optimization, TTFB, asset delivery, scripts execution time, DOM size, etc.
• SEO – Mobile friendly, meta, crawling, canonical, structure, etc.
• Best Practices – Image optimization, JS libraries, browser error logging, accessible over HTTPS, known JS vulnerabilities, etc
• Accessibility  – Page elements, language, ARIA attributes, etc.
• PWA (Progressive Web Application) – redirect HTTP to HTTPS, response code ok, fast loading on 3G, splash screen, viewport, etc.

UI Code / developer involvement

-------------------------- --------------

3.PWA: provide unexpected offline support for app to surve and store in local instead of broken

4.Accessibility :Aria-label=" text to hover explain" - button, link, video, 

                        Screen reader - extension/ plugin

5.Early loading-PRPL - semi page load (on scroll down make another) or html,css load then load the app data values

<link rel="preload" as="style" href="css/style.css"> Lazy load

• Push (or preload) critical resources.
• Render the initial route as soon as possible.
• Pre-cache remaining assets.
• Lazy load other routes and non-critical assets
• 5.SSR - Server side rendering.
•