Web Extras

What is the latest version of HTML?

HTML 5.2, published by the World Wide Web Consortium (W3C) on December 14, 2017 [32], is the last finalized version of HTML released as a W3C Recommendation. Work on HTML 5.3 began afterward, but it was never completed or officially released. As a result, there is no official “next version” of HTML, such as HTML 6, and HTML 5.2 remains the latest formal snapshot by the W3C.

The responsibility for maintaining the HTML specification has shifted from W3C to the Web Hypertext Application Technology Working Group (WHATWG), a consortium formed by leading browser companies, including Apple, Google, Mozilla, and Microsoft [32]. WHATWG introduced the concept of the HTML Living Standard, which is continuously updated to reflect the latest features, improvements, and browser implementations.

In May 2019, W3C and WHATWG signed a Memorandum of Understanding (MOU) to collaborate on a single version of the HTML and DOM specifications. This agreement formalized the transition: W3C no longer independently publishes HTML standards and instead works to bring WHATWG Review Drafts to W3C Recommendations. As part of this collaboration, W3C retired its HTML specifications, including HTML 5.2, on January 28, 2021, in favor of the continuously evolving HTML Living Standard maintained by WHATWG [33].

What are CSS rules and how do they work?

CSS rules determine how web page elements are presented and structured. Broadly, all CSS rules can be classified into two main categories:

• Style rules: the standard rules most commonly used in CSS. They consist of a selector, which identifies the HTML element(s) to be styled, and a declaration block, which defines the properties and values.
  

  Example:

    p {
      color: blue;
      font-size: 16px;
    } 
              

  This rule sets the text color to blue and the font size to 16 pixels for all elements. Style rules also follow the concept of specificity, which determines which rules take precedence when multiple rules target the same element. Understanding specificity is essential for avoiding conflicts and ensuring the intended styles are applied.

• At-rules: special instructions that start with the @ symbol and extend CSS beyond basic styling, such as including external stylesheets, applying conditional rules, or defining animations. Key examples include:
  • @import: allows including external style sheets. This promotes modular and reusable CSS, though excessive use can slow page loading.
  • @media: applies styles conditionally based on device characteristics, such as screen size or orientation, enabling responsive design across desktops, tablets, and mobile devices.
  • @font-face: lets designers embed custom fonts for consistent typography across platforms.
  • @keyframes: defines animations by specifying how element styles change over time.
  • @supports: applies styles only if the browser supports certain CSS features, enhancing compatibility.
  • @layer: introduced recently to control the cascade and prioritize certain sets of styles, improving maintainability of complex CSS [34].

  At-rules give developers greater control over styling behavior, resource management, and interactivity. While style rules determine how elements look, at-rules dictate when, how, or from where styles are applied, significantly expanding the flexibility and power of CSS.

Can URLs include non-Latin characters? How are they handled?

You can use non-Latin or Arabic words in a URL through Internationalized Domain Names (IDNs) and Internationalized Resource Identifiers (IRIs).

IDNs allow domain names (the “example.com” part) to include characters from scripts such as Arabic, Chinese, or Japanese. Internally, browsers convert these into Punycode, an ASCII-only representation, so servers can process the address. For example, the Arabic domain “مثال.إختبار” becomes “xn--mgbh0fb.xn--kgbechtv” when resolved [40].

IRIs extend this support to the rest of the URL path, such as directories or file names. Non-ASCII characters in the path are first converted to UTF-8, then encoded using percent-encoding (e.g., “ملف_تجريبي.html” becomes “%D9%85%D9%84%D9%81_%D8%AA%D8%AC%D8%B1%D9%8A%D8%A8%D9%8A.html”) so protocols like HTTP can transmit them safely [40].

Overall, multilingual URLs make websites easier to read and remember worldwide, and modern browsers ensure safe use by preventing confusion or phishing.

Does JavaScript Support Pre and Post Incrementation? What's the Difference?

In JavaScript, both pre-increment (++i) and post-increment (i++) operators increase a variable's value by 1, but they do so at slightly different times in the expression.

• Pre-increment (++i) → increments the variable before returning it.
• Post-increment (i++) → returns the current value first, then increments it afterward.

Example:

  let i = 5;
    console.log(++i); // prints 6 (increment first, then return)

  let j = 5;
    console.log(j++); // prints 5 (return first, then increment)
        

For primitive values (like numbers), both perform almost the same.
However, when dealing with objects or arrays, i++ may create a temporary copy before incrementing, which can cause a small performance cost [41].

What Are Regular Expressions? How Do They Work in JavaScript and Python?

A regular expression (or regex) is a sequence of characters that defines a search pattern. It is used to find, match, replace, or validate text, such as verifying an email address, extracting numbers, or cleaning up data.
Regex patterns are supported by most programming languages, and while syntax details can vary, the main idea is to describe text patterns precisely.

The following table summarizes the essential parts of regex syntax used in most programming languages:

These symbols form the universal core of regex used across most languages, including JavaScript and Python. Note that special characters in regex need to be escaped with a backslash (\) to be treated literally. For example, use \. to match a literal dot.

Regex in JavaScript

In JavaScript, regular expressions are objects that define patterns to match character combinations in strings.
They are commonly used with:

• RegExp methods: test() and exec().
• String methods: match(), matchAll(), replace(), search(), and split() [45].

Example:

const re1 = /ab+c/;  // Literal notation (compiled when the script loads)


const re2 = new RegExp("ab+c");  // Constructor function (compiled at runtime)
            

• Use the literal form for fixed patterns (faster performance).
• Use the constructor when building dynamic patterns (for example, from user input).

For more details, visit MDN Web Docs: Regular Expressions in JavaScript .

Regex in Python

Python provides regex support through the built-in re module.

The table below lists the main functions in Python's re module and what each one does:

Examples:

import re
txt = "The rain in Spain"
pattern = r"^The.*Spain$"
result = re.search(pattern, txt)
print(bool(result))  # True
        

import re
txt = "hello 123 world 456"
numbers = re.findall(r"\d+", txt)
print(numbers)  # ['123', '456']

For more details, visit W3Schools: Python RegEx .

How Do Websites Keep Your Passwords Secure?

When you type your password into a website or app, you might wonder if someone behind the scenes can see it. In a secure system, no one, not even the IT team, can view your actual password. This is because of a process called hashing.

The hashing process involves using a hash function, which converts your password into a fixed, seemingly random string of characters known as a hash. This function is one-way, meaning it cannot be reversed to reveal the original password.

Most modern systems also use a method called salting. Salting is the process of adding a unique, random value (called a salt) to a plaintext password before hashing it. This ensures that even if two users choose the same password, their resulting hashes will be completely different. Salting is important because it makes several common attacks much harder to perform. These attacks include dictionary attacks (using lists of common passwords), rainbow table attacks (using precomputed hash databases), and brute-force attacks (trying every possible combination) [46].

Common hash functions include: MD5, Bcrypt, Scrypt, and Argon2 [46]. Each algorithm has its own strengths and weaknesses, but all are designed to securely store passwords.

When a user tries to log in, the system takes the entered password and applies the same hashing process using the stored salt. It then compares the new hash with the one saved in the database. If the two hashes match, the password is verified and access is granted, all without ever storing or revealing the actual password.

Does Modifying a Variable Inside a foreach Loop Also Change the Original Array in PHP and Python?

In both PHP and Python, modifying the loop variable inside a foreach loop does not change the original array or list. This is because the variable used in the loop acts as a temporary copy of each element's value, not a direct reference to it. However, each language provides its own way to modify the original collection if needed.

In PHP: Using References

In PHP, you can modify the original array during a foreach loop by using a reference variable. By adding an ampersand (&) before the loop variable, each iteration refers to the actual array element rather than a copy.

Example:

$colors = ["red", "green"];
foreach ($colors as &$x) {
    $x = "blue";
}
unset($x); // break the reference to avoid unexpected behavior

Here, $x points directly to each element, so any changes affect the array itself. In this case, the original array becomes ["blue", "blue"]. Without the ampersand (foreach ($colors as $x)), $x is only a copy, and the original array remains unchanged.

Note: When using references in a foreach loop, PHP keeps the loop variable (e.g., $x) linked to the last array element even after the loop ends. To prevent unexpected changes, it's best practice to call unset($x) right after the loop [47].

In Python: Using Index-Based Loops

In Python, a standard (for x in colors:) loop does not modify the original list, because the variable x only stores a temporary copy of each element's value. To change the list itself, you must access and update its elements directly using their indexes.

Example:

colors = ["red", "green"]
for i in range(len(colors)):
    colors[i] = "blue"

Here, len(colors) returns the number of elements in the list (2). The range() function then produces a sequence of numbers starting from 0 up to, but not including, that value. In this case, range(len(colors)) gives [0, 1], which are the indexes of the list. The loop uses these indexes to visit each position so that colors[i] can be updated directly [48].

After the loop, the list becomes ["blue", "blue"], since each element was replaced in place.

What Is Local Storage in Web Browsers?

The localStorage object is part of the Web Storage API, allowing websites to store key-value pairs directly inside the user's browser. Unlike cookies, this data is not automatically sent to the server with each request, which improves performance and privacy. Each website (origin) has its own isolated storage space, and both keys and values are stored in UTF-16 string format [49]. The data saved in localStorage persists even after closing the browser or restarting the device. It remains available until it is explicitly cleared by the user or removed using JavaScript code [50].

Several built-in JavaScript methods for working with localStorage are summarized in the table below:

Complex data types such as arrays or objects cannot be stored directly in localStorage, since it only supports string values. To store structured data, it is common to use JSON.stringify(), which converts the object into a JSON-formatted string before saving, and JSON.parse() to convert it back into an object when retrieving [51].

Example:

const user = { name: "John", age: 20 };
localStorage.setItem("user", JSON.stringify(user));  // store as string
const retrievedUser = JSON.parse(localStorage.getItem("user"));  // parse back to object
        

While localStorage is convenient, it should not be used for sensitive data, as it can be accessed by any script running on the same origin. Most browsers limit the storage size to approximately 5 MB per domain, and persistence may be restricted if the user disables cookies or blocks data storage [49].