frontends

Frontends refer to the portion of software that runs in the user's environment, most commonly a web browser, and is responsible for presenting information and handling user interactions. In a typical web application, the frontend communicates with a backend server to request data and submit input.

The core technologies are HTML, CSS, and JavaScript. Many frontends are built with libraries and frameworks such as React, Angular, Vue, or Svelte, which support component-based design and declarative rendering. Rendering can occur in the browser via a virtual DOM in some frameworks or through direct DOM updates in others.

Frontend architectures often organize UI into reusable components and routes. Single-page applications load once and update the UI dynamically, while multi-page apps navigate by loading new documents. Data flows to and from backends through APIs, commonly REST or GraphQL, and sometimes via WebSocket for real-time updates. State is managed locally or in global stores.

Developers use tooling such as bundlers (Webpack, Vite), preprocessors, and transpilers (TypeScript, Babel) to build and optimize code. Performance and accessibility are central concerns, with practices like responsive design, code splitting, lazy loading, and progressive enhancement.

Advanced topics include server-side rendering and static site generation, which improve initial load times and search engine optimization. Progressive web app features, service workers, and offline capabilities extend accessibility and reliability across networks.

Security and quality considerations include protecting against XSS and CSRF, ensuring accessible semantics, and performing unit, integration, and end-to-end testing. Frontend performance is tracked with metrics such as LCP (Largest Contentful Paint), FID (First Input Delay), and CLS (Cumulative Layout Shift).

In contemporary development, frontends coexist with backend services and may form parts of larger architectures such as JAMstack or micro-frontend ecosystems.