Questions: Web Technologies
Back to Topics List

Web Technologies Questions

Page 3 of 13 (Displaying Questions 201 – 300 of 1207 Total)

201. What is the purpose of the `will-change` CSS property?

Show Answer

It is used as an optimization hint to the browser, informing it in advance which properties on an element are expected to change, allowing it to prepare necessary optimizations.

Added: Nov 30, 2025

202. How do you style elements based on their parent's state in CSS?

Show Answer

Using the `:has()` relational pseudo-class, which allows selection of an element if any of the relative selectors passed as arguments match.

Added: Nov 30, 2025

203. What is the difference between `filter` and `backdrop-filter`?

Show Answer

`filter` applies visual effects (blur, grayscale) to the element itself. `backdrop-filter` applies effects to the area behind the element.

Added: Nov 30, 2025

204. What is `initial` layout in CSS?

Show Answer

The initial or default positioning and sizing of elements as determined by the browser before any custom CSS or user agent styles are applied.

Added: Nov 30, 2025

205. How do you ensure form accessibility beyond just required fields?

Show Answer

By using proper labeling (`<label for="id">`), keyboard navigation checks (tabindex), and ARIA attributes for custom controls.

Added: Nov 30, 2025

206. What is the Observer pattern in JavaScript?

Show Answer

A design pattern where an object (Subject) maintains a list of dependents (Observers) and notifies them automatically of any state changes.

Added: Nov 30, 2025

207. Explain the Factory pattern.

Show Answer

A creational pattern that uses a factory method to create objects without specifying the exact class or constructor, abstracting the instantiation logic.

Added: Nov 30, 2025

208. What is the Singleton pattern?

Show Answer

A design pattern that restricts the instantiation of a class to one object (or single instance).

Added: Nov 30, 2025

209. What is the Mediator pattern?

Show Answer

A behavioral pattern that allows objects to communicate indirectly through a central mediator object, reducing direct dependencies.

Added: Nov 30, 2025

210. Explain the differences between MVC, MVP, and MVVM architectural patterns.

Show Answer

MVC separates logic into Model, View, Controller. MVP uses a Presenter to intermediate between Model and View. MVVM uses a ViewModel with data binding to connect View and Model.

Added: Nov 30, 2025

211. What is the Proxy pattern in web development?

Show Answer

It provides a surrogate or placeholder for another object to control access to it, often used for lazy instantiation or validation.

Added: Nov 30, 2025

212. What are Custom Elements in Web Components?

Show Answer

User-defined HTML elements with custom functionality and encapsulated styles, defined using the CustomElementRegistry API.

Added: Nov 30, 2025

213. What is the use of the `adoptedStyleSheets` API?

Show Answer

It allows CSS style sheets to be shared and reused across multiple Shadow Roots or the document, improving performance and reducing style duplication.

Added: Nov 30, 2025

214. What is the Intersection Observer API?

Show Answer

A modern API that provides a way to asynchronously observe changes in the intersection of a target element with an ancestor element or with the document's viewport.

Added: Nov 30, 2025

215. What is the Resize Observer API?

Show Answer

An API that provides a performant mechanism for monitoring when an element's size changes, without relying on continuous polling or window resize events.

Added: Nov 30, 2025

216. Explain the concept of Push API and Notifications API.

Show Answer

Push API allows a Service Worker to receive messages from a server even when the app is not actively running. Notifications API displays those messages to the user.

Added: Nov 30, 2025

217. What is the Web Storage API?

Show Answer

The collective name for localStorage and sessionStorage, providing mechanisms for storing simple key-value pairs client-side.

Added: Nov 30, 2025

218. What is the Page Visibility API?

Show Answer

An API that lets you know when a page is visible to the user, allowing optimized resource usage by pausing non-critical operations when the page is hidden.

Added: Nov 30, 2025

219. What is the difference between a synchronous and an asynchronous script?

Show Answer

Synchronous scripts halt HTML parsing until they are fetched and executed. Asynchronous scripts (using `async` or `defer`) do not halt parsing.

Added: Nov 30, 2025

220. What is the Web Cryptography API?

Show Answer

An API that provides cryptographic primitives to perform basic operations like hashing, signing, and encryption directly in the browser.

Added: Nov 30, 2025

221. Explain the purpose of the Permissions API.

Show Answer

It allows developers to query the status of different browser permissions (like geolocation or notifications) without having to trigger a permission request.

Added: Nov 30, 2025

222. What is the Web Speech API?

Show Answer

A collection of APIs that enable the browser to interpret speech (Speech Recognition) and synthesize speech (Speech Synthesis).

Added: Nov 30, 2025

223. How do you prevent a form from submitting while an asynchronous operation is running?

Show Answer

By disabling the submit button and/or using `event.preventDefault()` in the submit handler until the operation is complete.

Added: Nov 30, 2025

224. What are regular expressions in JavaScript?

Show Answer

Patterns used to match character combinations in strings, often used for validation or search-and-replace operations.

Added: Nov 30, 2025

225. What is the benefit of using `requestIdleCallback`?

Show Answer

It schedules a function to be run when the browser is idle, ensuring that non-essential, background tasks don't interfere with critical animations or user input.

Added: Nov 30, 2025

226. What is Content Security Policy (CSP)?

Show Answer

An HTTP response header that defines which dynamic resources are allowed to load, mitigating XSS and data injection attacks.

Added: Nov 30, 2025

227. What is the X-Content-Type-Options header used for?

Show Answer

It prevents browsers from "sniffing" a response away from the declared content-type, helping to mitigate content confusion attacks.

Added: Nov 30, 2025

228. Explain the X-Frame-Options header.

Show Answer

A security header used to prevent clickjacking attacks by dictating whether a browser should be allowed to render a page in a <frame>, <iframe>, or <object>.

Added: Nov 30, 2025

229. What is Public Key Pinning (HPKP)?

Show Answer

A security measure (now largely deprecated) that told browsers to remember, or "pin," the SSL certificate for a website to prevent MITM attacks using fraudulent certificates.

Added: Nov 30, 2025

230. How do refresh tokens differ from access tokens in OAuth?

Show Answer

Access tokens grant access to protected resources and are short-lived. Refresh tokens are long-lived and used to obtain a new access token once the current one expires.

Added: Nov 30, 2025

231. What is Certificate Transparency (CT)?

Show Answer

A protocol that provides a public, verifiable record of all SSL/TLS certificates issued by Certificate Authorities, helping to catch misissued or malicious certificates.

Added: Nov 30, 2025

232. What is the purpose of the `no-referrer` header policy?

Show Answer

It prevents the browser from sending any referrer information when navigating away from the current document, enhancing user privacy.

Added: Nov 30, 2025

233. Explain SQL Injection and how to prevent it.

Show Answer

A security flaw where an attacker can interfere with the queries that an application makes to its database. Prevented primarily by using parameterized queries (prepared statements).

Added: Nov 30, 2025

234. What is a security vulnerability disclosure policy?

Show Answer

A set of guidelines outlining how security researchers can responsibly report vulnerabilities they discover in a system to the organization.

Added: Nov 30, 2025

235. What is the role of a Web Application Firewall (WAF)?

Show Answer

A firewall that monitors, filters, or blocks HTTP traffic to and from a web application, protecting it from attacks like XSS, SQLi, and CSRF.

Added: Nov 30, 2025

236. What are Progressive Web Apps (PWAs)?

Show Answer

Web applications built using modern web capabilities to deliver an app-like user experience, featuring offline support, installability, and fast loading.

Added: Nov 30, 2025

237. What is the Web App Manifest?

Show Answer

A JSON file that provides information about a PWA (name, icons, start URL) to the browser, necessary for the app to be "installed" on the user's device.

Added: Nov 30, 2025

238. Explain the concept of offline-first.

Show Answer

A development philosophy that prioritizes the user experience when the device is offline or has a poor network connection, often using Service Workers and caching.

Added: Nov 30, 2025

239. What is the difference between a Single Page Application (SPA) and a Multi-Page Application (MPA)?

Show Answer

SPA loads a single HTML page and dynamically updates content. MPA requires the browser to load a new HTML page for every navigation.

Added: Nov 30, 2025

240. What is hydration in client-side rendering frameworks?

Show Answer

The process where client-side JavaScript attaches event listeners and state to the server-rendered HTML markup, making the page interactive.

Added: Nov 30, 2025

241. What is Jamstack?

Show Answer

A modern web architecture based on client-side JavaScript, reusable APIs, and prebuilt Markup, emphasizing speed, security, and scalability.

Added: Nov 30, 2025

242. Explain the purpose of Static Site Generators (SSGs).

Show Answer

Tools (like Jekyll or Hugo) that build a complete, static HTML website from source files (markdown, templates) at deployment time, avoiding server-side processing at runtime.

Added: Nov 30, 2025

243. What is the difference between client-side and server-side routing?

Show Answer

Client-side routing changes the visible URL and updates the DOM without a full page reload. Server-side routing requires the server to send a new HTML document for every URL change.

Added: Nov 30, 2025

244. What is the Virtual DOM (VDOM)?

Show Answer

A programming concept where a virtual representation of the UI is kept in memory and synced with the "real" DOM. It is used to minimize direct DOM manipulations for better performance.

Added: Nov 30, 2025

245. Explain the concept of WebAssembly (Wasm).

Show Answer

A low-level binary instruction format for a stack-based virtual machine, designed as a portable compilation target for high-level languages like C/C++/Rust, allowing near-native performance on the web.

Added: Nov 30, 2025

246. What is the event phase of an event listener?

Show Answer

It refers to the three stages of event propagation: capturing phase (down the tree), target phase (at the element), and bubbling phase (up the tree).

Added: Nov 30, 2025

247. What is debouncing?

Show Answer

A technique to limit the rate at which a function fires. It ensures a function is executed only after a specified period of inactivity.

Added: Nov 30, 2025

248. What is throttling?

Show Answer

A technique to limit the rate at which a function fires. It ensures a function executes at most once every specified period.

Added: Nov 30, 2025

249. What are JavaScript Proxies used for?

Show Answer

To create an object that can be used in place of another object, enabling custom behavior like validation, access logging, or handling non-existent properties.

Added: Nov 30, 2025

250. Explain the concept of a Microfrontend architecture.

Show Answer

An architectural style where a large frontend application is broken down into smaller, independent, and deployable units, each managed by a different team.

Added: Nov 30, 2025

251. What is the purpose of the `navigator` object?

Show Answer

It contains information about the browser, such as the user-agent, operating system, and support for various features.

Added: Nov 30, 2025

252. What is the global `window` object?

Show Answer

The object representing the window in which the script is running. It is the topmost object in the DOM hierarchy and holds global variables and functions.

Added: Nov 30, 2025

253. How do you perform deep cloning in JavaScript?

Show Answer

The most common method is using `JSON.parse(JSON.stringify(object))`, though this method fails to copy functions, Dates, or Symbols.

Added: Nov 30, 2025

254. What is the purpose of the `finally` block in a try-catch statement?

Show Answer

The code inside the `finally` block always executes, regardless of whether an exception was thrown or caught.

Added: Nov 30, 2025

255. What are default parameters in functions?

Show Answer

A feature allowing named parameters to be initialized with default values if no value or `undefined` is passed.

Added: Nov 30, 2025

256. What is the `new.target` property?

Show Answer

It is a meta-property available inside functions and constructors that tells you whether the function was called with the `new` keyword.

Added: Nov 30, 2025

257. Explain the term "polyfill".

Show Answer

A piece of code (usually JavaScript) that provides the functionality of a newer API to older browsers that do not natively support it.

Added: Nov 30, 2025

258. What is functional programming (FP) in JavaScript?

Show Answer

A programming paradigm that treats computation as the evaluation of mathematical functions and avoids changing state and mutable data.

Added: Nov 30, 2025

259. What is the role of `pure functions` in FP?

Show Answer

A pure function always returns the same result given the same arguments and has no side effects (does not modify outside state).

Added: Nov 30, 2025

260. How do you handle multiple nested callbacks in legacy JavaScript?

Show Answer

Using techniques like promises, async/await, or modularizing the code to avoid deeply indented "callback hell."

Added: Nov 30, 2025

261. What is a closure property of an arrow function?

Show Answer

Arrow functions do not have their own `this` context. Instead, they lexically bind `this` to the context where they are defined (their parent scope).

Added: Nov 30, 2025

262. What is the difference between `let` and `const` regarding mutation?

Show Answer

`const` prevents reassignment of the variable reference, but the value it points to (if an object or array) can still be mutated.

Added: Nov 30, 2025

263. How does the `for...of` loop differ from `for...in`?

Show Answer

`for...of` iterates over iterable values (like array elements). `for...in` iterates over enumerable property names (keys) of an object.

Added: Nov 30, 2025

264. What is the purpose of the `WeakMap`?

Show Answer

It is similar to a `Map` but its keys must be objects, and those keys are held weakly, allowing them to be garbage collected if no other references exist.

Added: Nov 30, 2025

265. Explain JavaScript `Tagged Templates`.

Show Answer

A more advanced form of template literals where the template is preceded by a function call (the tag). The function receives the string parts and variable values.

Added: Nov 30, 2025

266. What is a mutation observer?

Show Answer

An API that provides a way to detect changes to the DOM tree (additions, removals, attribute changes).

Added: Nov 30, 2025

267. How do you manually dispatch an event in JavaScript?

Show Answer

Using the `dispatchEvent` method on an element after creating a new event object (e.g., `new CustomEvent`).

Added: Nov 30, 2025

268. What is the difference between a custom element and a custom data attribute?

Show Answer

A custom element is a new HTML tag with encapsulated behavior. A custom data attribute (`data-*`) is an attribute on an existing element to store data.

Added: Nov 30, 2025

269. What is the role of the `sandbox` attribute on an `<iframe>`?

Show Answer

It applies restrictions to the content within the frame, such as disabling scripts, forms, or navigating the top-level window, enhancing security.

Added: Nov 30, 2025

270. Explain the purpose of the `referrerpolicy` attribute.

Show Answer

It controls how much referrer information (URL of the requesting page) should be included with HTTP requests.

Added: Nov 30, 2025

271. What is the use of `prefers-color-scheme` media query?

Show Answer

It allows developers to serve different styles based on whether the user has set their operating system to light or dark mode.

Added: Nov 30, 2025

272. How do you create a "sticky" header that is visually distinct when scrolled?

Show Answer

Use `position: sticky;` combined with JavaScript/Intersection Observer to add a class to the header when the scroll position meets a threshold.

Added: Nov 30, 2025

273. What are CSS Flex Shorthands?

Show Answer

Shorthand properties like `flex-flow` (combining `flex-direction` and `flex-wrap`) and the `flex` property (combining `flex-grow`, `flex-shrink`, and `flex-basis`).

Added: Nov 30, 2025

274. Explain the difference between `repeat()` and `auto-fill`/`auto-fit` in CSS Grid.

Show Answer

`repeat()` defines a fixed number of tracks. `auto-fill`/`auto-fit` dynamically adjusts the number of tracks based on the container size and track minimum size.

Added: Nov 30, 2025

275. What are viewport units (vmin, vmax)?

Show Answer

Units relative to the viewport size: `vmin` is the minimum of `vw` or `vh`. `vmax` is the maximum of `vw` or `vh`.

Added: Nov 30, 2025

276. How do you create fluid typography using `clamp()`?

Show Answer

`clamp(min, preferred, max)` allows you to set a minimum font size, a preferred responsive size (e.g., `3vw`), and a maximum font size, preventing text from becoming too small or too large.

Added: Nov 30, 2025

277. What is the difference between `background-size: cover` and `contain`?

Show Answer

`cover` scales the image to cover the entire background area, potentially cropping. `contain` scales the image to fit entirely within the background area, showing the whole image.

Added: Nov 30, 2025

278. What is the purpose of the `accent-color` property?

Show Answer

A CSS property used to set the color tint for form elements (checkboxes, radio buttons, range inputs) with a single property.

Added: Nov 30, 2025

279. How does the `filter` property affect performance?

Show Answer

Some filter values (like `blur` or `drop-shadow`) can be computationally expensive, particularly if applied to large areas or changing often, potentially forcing GPU usage.

Added: Nov 30, 2025

280. What are CSS variables (custom properties) useful for?

Show Answer

Reducing repetition, making code easier to maintain, and enabling runtime manipulation of styles via JavaScript.

Added: Nov 30, 2025

281. What is the difference between a CSS transform and a transition?

Show Answer

A transform is a set of geometric operations (translate, scale, rotate) applied instantaneously. A transition smoothly animates the change in a property over time.

Added: Nov 30, 2025

282. What is the purpose of the `box-decoration-break` property?

Show Answer

It specifies how an element's box model properties (padding, border, margin) should be rendered when the box is fragmented (e.g., when text wraps across multiple lines).

Added: Nov 30, 2025

283. What is the `backdrop-filter` property used for?

Show Answer

It applies graphical effects like blur or color shifts to the area *behind* an element, allowing the background to show through the filter effect.

Added: Nov 30, 2025

284. What is a CSS hook?

Show Answer

A specific, non-semantic class name or custom property used solely as a target for JavaScript or a preprocessor.

Added: Nov 30, 2025

285. How do you implement infinite scrolling (lazy loading on scroll)?

Show Answer

By attaching an event listener to the window/container scroll event, or more efficiently, using the Intersection Observer API to detect when the last item enters the viewport.

Added: Nov 30, 2025

286. What is a Race Condition in JavaScript?

Show Answer

A situation where two or more asynchronous tasks access a shared resource and the outcome depends on the unpredictable order of their execution.

Added: Nov 30, 2025

287. Explain the purpose of the `finally` block in Promise chains.

Show Answer

It is used for cleanup operations that must be executed regardless of whether the Promise was fulfilled or rejected.

Added: Nov 30, 2025

288. What is the role of `Object.freeze()`?

Show Answer

It prevents new properties from being added to an object, prevents existing properties from being removed, and prevents the values or writability of existing properties from being changed.

Added: Nov 30, 2025

289. What are Array Buffers and Typed Arrays?

Show Answer

Array Buffers are raw binary data buffers. Typed Arrays provide views (like Int8Array, Float64Array) into these buffers for handling specific numeric types.

Added: Nov 30, 2025

290. What is the `structuredClone()` function?

Show Answer

A modern built-in JavaScript function used to perform a deep copy of a value, capable of cloning complex objects, Maps, Sets, and Typed Arrays.

Added: Nov 30, 2025

291. What is module bundling?

Show Answer

The process of taking various source files (JavaScript, CSS, assets) and compiling them into a small number of optimized files suitable for deployment.

Added: Nov 30, 2025

292. How does a Webpack loader differ from a Webpack plugin?

Show Answer

Loaders process source files (e.g., transform ES6 to ES5). Plugins execute during the entire compilation lifecycle to modify how the bundle is created (e.g., optimization).

Added: Nov 30, 2025

293. What is hot module replacement (HMR)?

Show Answer

A feature of modern bundlers that allows JavaScript modules to be updated in a running application without a full page reload, preserving the application state.

Added: Nov 30, 2025

294. Explain the concept of Serverless Architecture.

Show Answer

A model where the cloud provider manages the server infrastructure, automatically scaling resources, and developers pay only for the compute time consumed.

Added: Nov 30, 2025

295. What is the purpose of a reverse proxy?

Show Answer

A server that sits in front of one or more web servers, intercepting client requests, and directing them to the appropriate backend server (e.g., Nginx).

Added: Nov 30, 2025

296. What is the difference between latency and throughput?

Show Answer

Latency is the time delay before a transfer of data begins following an instruction. Throughput is the rate at which data is successfully transferred per unit of time.

Added: Nov 30, 2025

297. How is data typically exchanged in microservices architecture?

Show Answer

Through synchronous requests (like REST/gRPC) or asynchronous messages (via message queues/brokers).

Added: Nov 30, 2025

298. What is the purpose of the `same-origin` policy in iframes?

Show Answer

It prevents scripts in the iframe from accessing or manipulating the content of the parent window if they are loaded from different origins.

Added: Nov 30, 2025

299. What is a Session Hijacking attack?

Show Answer

An attack where an attacker steals a valid session ID to gain unauthorized access to a user's account, often through XSS or MITM.

Added: Nov 30, 2025

300. What is input validation in security?

Show Answer

The process of ensuring that user-provided data matches the expected format, type, and length before it is processed or stored, preventing injection attacks.

Added: Nov 30, 2025