The will‑change Property in CSS
The 'will‑change' property in CSS is a signpost that the element is expected to change, allowing This allows the browser to optimise and improve responsiveness.
Articles
Front‑end Development, page 10 of 24
Front‑end web development is my personal niche, it is the art of creating visual and interactive elements for a website, including layout, design, and interactivity, using HTML, CSS, and JavaScript.
Below you will find a subset of articles from my blog specifically about Front‑End Development. This is an area I have worked with for many years, and it has been a regular subject in my writing. There are four hundred sixteen articles collected together for you below.
The will‑change Property in CSS. The
Using the Modulo Operator in JavaScript. Using the Modulo Operator in JavaScript
A discussion about the JavaScript modulo operator, its functionality, origins, and diverse applications in web dev, including arithmetic and complex algorithms.
Throttling Scroll Events in JavaScript. Throttling Scroll Events in JavaScript
Care needs to be taken when using the onScroll event; it can trigger frequently, leading to greater client‑side resource (CPU) usage, and a laggy interface.
What A Levels Do You Need for Software Engineering? What A Levels Do You Need for Software Engineering?
What A Levels help most for software engineering in the UK? This guide covers Maths, where Computer Science helps, and routes beyond a perfect set.
How to Handle Multiple Named Exports in One JavaScript File. How to Handle Multiple Named Exports in One JavaScript File
A simple explanation about how to handle multiple named exports from a single JavaScript file; an essential piece of knowledge when developing modern websites.
Why Remote Work Did Not Make Brighton Web Developers Less Local. Why Remote Work Did Not Make Brighton Web Developers Less Local
Remote work changed how Brighton web developers collaborate, build trust, support clients, and use local expertise without being limited by geography.
How to Import All Named Exports from a JavaScript File. How to Import All Named Exports from a JavaScript File
When export and import was introduced as part of ES6, things changed for the better in JavaScript development. It still causes confusion though. Let me explain.
Check If a String Contains Only Whitespace with JavaScript. Check If a String Contains Only Whitespace with JavaScript
Determining whether an input in your application consists of only whitespace needn't be a particularly difficult or complex task. Trim() or Regex will work!
Keeping Gatsby Build Times Under Control. Keeping Gatsby Build Times Under Control
How to keep Gatsby build times under control by managing data volume, image work, plugins, GraphQL queries, caching, and deployment expectations.
Higher‑Order Functions in JavaScript. Higher‑Order Functions in JavaScript
Higher‑order functions in JavaScript take functions as arguments or return them. Here, I explore their benefits, common use cases, and practical examples.
Improve Page Performance with content‑visibility. Improve Page Performance with
content‑visibilityUsing the CSS content‑visibility property we can control how an element interacts with the browser render, controlling when or how an element content renders.
Resolving mini‑css‑extract‑plugin Warnings in Gatsby. Resolving
mini‑css‑extract‑pluginWarnings in GatsbySeeing Conflicting Order warnings in your Terminal whilst building your Gatsby project is not uncommon, but fortunately is very easy to fix (or suppress) too.
The End of Internet Explorer. The End of Internet Explorer
Today marks a linchpin moment in web development, and especially front‑end development. Microsoft has formally retired their long‑standing, divisive browser.
Using Container Queries in CSS. Using Container Queries in CSS
Container queries are a powerful new feature in CSS that allow us to move away from view‑port based responsiveness to more explicit isolated areas of the page.
Position: sticky in CSS. position: stickyin CSSAchieving sticky positioning on the web was once a weighty process using JavaScript to detect scroll positions and switch styles. Now, we have position: sticky!
Using the CSS :has Pseudo‑Class. Using the CSS
:hasPseudo‑ClassThe :has CSS selector allows you to select a parent element based on whether it has a certain child or children. It's powerful but it has some limitations.
Spread Syntax in JavaScript (...). Spread Syntax in JavaScript (
...)In a nutshell, JavaScript spread syntax allows you to pass the elements of an iterable (for example an array), through to a function as individual elements.
The Safest Way to Test for NaN. The Safest Way to Test for
NaNNaN is an unusual concept in JavaScript, especially for developers newer to the language. As a result, testing for it can be more complex than first expected.