Find all my blog posts sorted by latest date below, or you can explore a variety of amazing content creators on my Blogroll.
I’ll be building on my earlier post about CSS asset fingerprinting, this time adding the preload response header into the mix. Together, these techniques make sure your browser grabs my blog’s CSS right away, keeping things fast and seamless.
Frontend development never stands still. By looking back at the legacy techniques and tools that once shaped the web, we gain perspective on why today’s best practices exist and how to avoid repeating past mistakes. This post takes a trip down memory lane to uncover lessons from the early days of web development, and considers how they might guide us as we stand on the verge of another shift with the rise of AI and the evolving web platform.
In this post, I investigate how you can use a mixture of dynamic and static Brotli compression with the Cloudflare Pro plan, for optimal web performance.
In this post I tackle something from my post-MVW (Minimum Viable Website) functionality to do list, by adding a plaintext RSS Feed. I'll take you through my reasons for adding it, the implementation, and the code I used to create it.
In this post I bring two previous blog posts together to create the perfect CSS setup for my little blog.
In this blog post, I'll show you how I've written an 11ty Shortcode to manipulate my CSS file, thus allowing for optimal long-life cache-control response headers. Any feedback on this build process would be greatly appreciated.
In this post, I review Cloudflare's image optimisation library, Mirage 2.0, and explain how it caused images on my blog to fail on all mobile devices for three weeks. I'll also offer suggestions to Cloudflare on how they can prevent this issue from impacting other Pro plan customers.
In this post I investigate how you can use a mixture of dynamic and static Brotli compression with the Cloudflare Pro plan, for optimal web performance.
This post explores refactoring a web performance snippet to improve security and align with modern best practices using the PerformanceObserver and PerformanceNavigationTiming API's.
In this post, I go through why you should improve the security of your static website and how to do it on various static hosting platforms. This includes Cloudflare Pages, Netlify, Vercel, Surge, Render, Firebase Hosting, Heroku, InfinityFree, and DigitalOcean.
It's been a while coming, but I've finally managed to get around to migrating to 11ty and Cloudflare Pages. I go over the ups and downs of the migration process in this blog post.
A lot can happen on the web platform and in life over 16-years. In this post I remanice about all the changes the web has gone through and try to figure out how nooshu.com came to be.
This is a blog post about the GOV.UK cookie banner and the reason it won't go away when navigating across UK government services. I also touch on security and privacy features available in modern browsers.
This is an RFC I wrote to persuade the GOV.UK Senior Technology team to remove Subresource Integrity (SRI) from GOV.UK's assets being served from the assets domain and allow for greater HTTP/2 performance.
This is an RFC I wrote to persuade the GOV.UK Senior Technology team to enable HTTP/2 on GOV.UK. It was accepted and merged into the repository, and enabled in June 2020.
This is an RFC I wrote to persuade the GOV.UK Senior Technology team to enable Brotli compression on GOV.UK. It was accepted and merged into the repo, and enabled in March 2021.
This is an RFC I wrote to persuade the GOV.UK Senior Technology team to enable HTTP/3 on GOV.UK. It was accepted and merged into the repo, and as of 11th Jan 2024 it has now been enabled!
I've finally had time to clean up some tech debt, so I migrated this blog onto Netlify fronted by Cloudflare and fixed the web performance issues I spotted.
Wednesday 21st April 2021 was a day like no other. This certainly isn't my usual web performance related blog post!
The 'Graph Page Data' view is a one of those WebPageTest features that is hidden in plain sight. So lets shine a light on it and see what it can do.
A step by step guide on how to get started with using Cloudflare Workers for web performance optimisation.
Cloudflare Workers are an awesome tool for rapid prototyping and observing web performance changes, here are a few recipes you may find useful.
Priority hints may be on hold, but you can still enable them and investigate what they can do. And in one instance I found a nice set of improvements to visual metrics.
Twitter embeds are bad for web performance. They cause so many extra requests, and a huge amount of data added to a page, so how can we fix it?
It's important to remember staff members are users too, so optimise your internal tools for performance for more productive and less stressed workforce! Here are some tools and resources to help you out.
A small change in the ordering of your font sources in the `@font-face` rule can have a big impact on data and web performance, especially when used in conjunction with the `preload` resource hint.
Let's examine the WebPageTest homepage and investigate what all the settings do, including examples of what you can use them for.
It's amazing what a difference a single little response header can have on web performance. Lets 'fix' it at the edge with a <s>Cloudflare Worker</s> CDN.
WebPageTest exposes all its data via an easy to access API, but the data listed can be overwhelming. Using a tool like jq can help. Here's how you use it.
Your may not think it, but your 404 page is an important part of your potential user journey. You should test its web performance as it can have a big impact on your users experience.
Weird things can happen to waterfalls when you don't set the correct response headers.
TLS 1.3 is the new kid on the cryptographic protocols block. It offers better security and better initial connection web performance. And IPv6 is a 'new' internet protocol. Lets examine some shiny new things!
A simple blog post bringing all the resources I used and created in the GOV.UK HTTP/2 work.
Custom dashboards and graphs are a really powerful feature of SpeedCurve. Here's a few examples of how we at GDS are using them for synthetic web performance monitoring.
The best way to benchmark improvements using WebPageTest is by comparing results. Here's a tool to help you do that.
The `font-display` property is a great way to tweak the way your fonts load, especially useful as fonts have a large effect on the perceived performance of your website.
SSL certificate revocation is complex, but absolutely necessary. And your choice of what certificate to use for your site is important, and you should consider its impact on web performance when doing so too.
There's more to WebPageTest than the Waterfall View. In this post I look at the the 'Connection View' and how it can be used to spot web performance issues.
Enabling HTTP/2 doesn't always lead to web performance gains. I believe I may have finally solved a mystery of why performance got worse in some cases.
I don't have any comment functionality on this blog, but I now have Webmentions available. Here's how I did it.
WebPageTest waterfall charts are a very powerful web performance tool, but can sometimes be a little confusing. Maybe this post can change that.
The `Save-Data` allows users to choose a data optimised browsing experience (if you put in the work).
Is a performance score of 100 in Lighthouse always for the better?
Frontend performance is important, especially for government services.
It's amazing what a few font tweaks can do to perceived performance. Now lighthouse hits 100/100 for performance!
Optimising the font loading method on GOV.UK to improve performance.
Old versions of Internet Explorer are in decline, so let's reconsider the testing requirements.
Recently something has gone slightly awry with the clouds in the header on Chrome. I wonder what it could be?
Service workers are all the rage at the moment, but how do we simplify their creation?
GDS: The Service Manual gets an update to add Samsung Internet to the testing matrix.
After over a year of using AMP, it's time to back out and remove it.
If you have a dig around inside the iTerm2 settings you will find lots to play with like 'Smart Selection'. We can use it to our advantage.
Time to have a little play around with the future of JavaScript, ES2015 (and beyond!)
Could the future of the mobile Web be upon us? Speed up your mobile pages using AMP!
Progressive web apps and Service Workers are the next big thing. Time to have a play with some tech!
With a little bit of Node.js you can create a countdown for a HTML email. Magic!
Using a UNIX shell is all the rage nowadays, even Windows 10 are doing it!
I ran into a slight hiccup with IE and CSS3 animations, turned out to be a simple fix.
Interchange is an excellent responsive image utility that comes with Foundation. Time to hook it up to Wordpress!
A lot can happen in two and a half years since my original build. Time to pull my sleeves up and make the old website responsive!
MarkerCluster is a handy helper for the Google Maps API, but how does its setCalculator method work?
I've never seen this functionality in any page I've used. Auto-spacing a credit card number as you type. I must admit I'm not a big fan of the idea, but lets build it anyway!
While developing a new mobile website I ran into an annoying issue while validating the input. Here's a solution, not nice but it works!
Time to say goodbye to all other text editors. Sublime Text 2 has a killer set of features and it's quick too!
After traveling through South East Asia for three months I've finally settled back into work. I've started a new job at an excellent digital agency called Visual Jazz Isobar!
With browsers getting faster all the time it's a good idea to remember that not everyone uses them. Writing efficient code is key to maximising device accessibility.
Design is hard! Well it is for me anyway. Here's a brilliant slideshow for developers to point you in the right direction.
Who would have thought version control could be so easy and fun? It can be with Git!
Working with Internet Explorer is never easy. jQuery takes some of the pain out of it, but not always!
As anyone who has worked on the web knows, a lot can change in three months. Time to get back to work and catch up with the latest goings on.
It's time to travel the globe, very nervous but extremely excited! SE Asia and Oz here we come!
What can be more fun than some cutting edge web technology and a bunch of people who love to create interesting demos!
The Wordpress auto update feature is superb; when it works. When it doesn't it can make you cry. Luckily there can be a quick fix.
What could make Wordpress any better? What about the ability to edit your posts directly in the page? Yay!
For some projects you may not need a fully featured JavaScript library. But what are the alternatives?
As a long time user of Firebug for Firefox, Google Chrome's Developer Tools are making me think about changing my debug tool!
Have your Wordpress Stats broke? Feel a little lost without that friendly graph on the Dashboard? You need Jetpack!
When you cross fractals with WebGL you're sure to catch my attention. Fractal Lab is a work of art!
Cool graphics in the browser, the demoscene has woken up to WebGL. Bring on the amazing demos!
What happens when you visualise 424,000 Wikipedia articles? A bloody good visualisation, that's what!
Automatically resizing an iframe inside a Facebook application was a bit of a hassle, but simple when you know how.
Google Labs hard at work on a particular interest of mine, fractal rendering.
For a small project I was changing the value of a disabled input box programmatically and needed an event to fire if a value changed.
Three.js now has a community on reddit, so why not submit a few links and experiments!
WebGL really is starting to take off now that more browser support is being added. There are some very impressive demos out there.
Mozilla Labs and Six to Start put on a great evening event in Shoreditch dedicated to the future of Open Web Gaming.
The web is becoming very exciting at the moment. Come up with an interesting idea and just build it. Open data is the future!
Revisited an old experiment that looks to have been broken for a while. Luckily it was a quick fix.
After attending Full Frontal 2009 I didn't want to miss out on this great conference in 2010.
Microsoft have finally pulled their finger out and produced a respectable browser* (*Only for Vista and Windows 7 users)
So you have your Wordpress install in Subversion. What about those pesky plug-ins that always need updating.
Using the post-commit hook with SVN makes updating a website dead simple... once you get it to work.
I hope other people find this fix useful, I wish I'd known about it a few hours earlier...
Today is a sad day for Mathematics, the maths genius Benoit Mandelbrot lost his battle with cancer.
jQuery has a host of carousel plug-ins available to use. jCarousel seems to be the most popular. A small error cause a few issues...
I've finally taken the plunge and I'm ditching Aptana IDE. I've been wanting to for a while but haven't found the right alternative.. until now.
Looking at the winners of the JS1k competition I really can't see how some of the entries have been produced! 1024 bytes goes a long way in JavaScript.
Adding a custom header image to a Wordpress theme has never been so easy. Simply copy / paste and edit the code listed.
A little bit of Drupal knowledge goes a long way! This amazing open source CMS allows you to build large scale websites easily.
The Mandelbrot set seems to pop up everywhere as it's without a doubt the most famous fractal. So heres a video.
There are many ways to edit and update content on a website, but none of them look quite a easy as Aloha Editor.
Here's the original source code for my entry into JS1k for anybody who wishes to see how the simple particle demo was created.
How much functionality can you achieve using only 1024 bytes of JavaScript? Quite a lot it seems, you just have to slim down the code.
You can buy all the books on visualisation technologies but what's the point if you never read them? Time to change that.
Finally got round to HTML5ing my Wordpress theme. Lots to learn with the (ongoing) HTML5 specifications.
I've had a couple of security scares with FrogCMS recently so have decided to look for another small CMS solution.
Decided to dip my toe in the murky world of the Drupal CMS (it's not that murky really), lots to learn about this very powerful framework. Here are a few links that fellow beginners may find useful.
Having a little time to spare I decided to update the Snipplr Plug-in for Wordpress, originally by Tyler Hall.
Building a mobile site can be quite painful, but it's made much easier using the DeviceAtlas API.
Post Thesaurus is broken.... oh wait no it isn't. Just a pesky JavaScript error from another plugin!
Snipplr was one of my favorite online coding tools until the new owners ruined it and let it stagnate. Now it's under new management!
Google Chrome has a superb feature called 'Create application shortcut...'. To polish off this feature with your web application use high resolution icons.
Converting your current posts isn't as easy as it looks. If you are comfortable editing the DB directly it's fairly simple.
Upgrading to the latest version of Wordpress on my development server didn't quite go as smoothly as expected.
Subversion is usually quite boring; why not add a little bit of Gource to make it a little more interesting!
When combining NextGEN gallery and built in Wordpress custom fields you can add some superb functionality which is easy to use.
I've used Frog CMS on small projects in the past and have been very impressed, but there looks to be a fork on the horizon...
Zen Coding really is an incredibly simple idea, use CSS selectors to write HTML. It sounds like a chicken egg argument, but it really works.
Here's a list I recommend for any Front End Web Developer just starting out in the big wild virtual world or web development.
With CSS3 it is now possible to add content to the page only using CSS. The content / layout lines are blurring just a little...
Added a little feature to the CodeColourer Wordpress plug-in on my website that I'd thought I'd share with people.
I created this plug-in for Wordpress as I have a tendency of using the word 'great' a little to much...
NextGEN gallery just got a little smoother with this fine addition.
Simple plug-in for hiding content above the page which is shown by clicking a tab.
NASA's Astronomy Picture of the Day website looks terrible, using some CSS3 and Firefox you can make it a little more presentable.
Here's a site that will make you go "wow". A raytracer in JavaScript and Canvas using only 512 bytes.... amazing.
It looks like Microsoft are finally getting their act together with their up and coming version of Internet Explorer.
Looking for a Canvas based JavaScript clock that also supports Time zones...
Things have stagnated on Snipplr.com, it's time to look for another tool for my code snippets.
jQuery Enlightenment is an excellent book by Cody Lindley
Get all the latest inside information of the new Formula One season via Twitter.
Finally solved an issue I'd been having with a couple of themes and the preview post functionality...
Sometimes the default markup for for the Wordpress sidebar isn't quite what you need. Here's how you change it.
Here are a few websites I'd like to share with you, they can really speed up your working process.
jsFiddle just keeps getting better and better, the perfect tool for demonstrating your code snippets.
For a while now Feedburner and the blogs RSS feed haven't been playing nicely, I finally figured out why.
jQuery has a wealth of methods for manipulating the DOM. The append() and prepend() methods i tend to use all the time.
A little snippet of code involving swfobject 2.2 and wmode that I always forget how to do.
Lots of improvements came with the latest version of jQuery. The delay method is one of my favourite.
Google have been tweaking Gmail again. Labels disappeared? Here's a quick fix.
While adding a few features to Post Ideas+ I needed to find all the administrator IDs in Wordpress.
A few extensions I use with Firefox to make my Web Development life easier.
Frog CMS can be made even simpler to implement with a couple of handy little code snippets.
Searching for a simple CMS for a client? Why not give Frog CMS a try.
With a little JavaScript and HTML5 it is possible to plot chaos using your browser.
Got a great idea for a blog post you don't want to forget? Use Post Ideas+ to keep track of them.
A quick and easy way to search websites from Google Chromes address bar.
You don't need a hammer and nails when you're a web developer. You do need your own set of tools thought . And maybe a tool belt...
Writing a plug-in for Wordpress it gave me a strange error. Solved it in the end though.
Internet Explorer 6 and the abbreviation tag don't play well together.
The Processing IDE (PDE) can be quite limited. As an alternative you can use Aptana or Eclipse. Here's how.
A wet and rainy day in Brighton for the Full Frontal JavaScript conference.
Add this little bit of code to your functions.php file to remove jQuery.
Created a very simple plug-in to set all column heights on a page to the same height.
Took a little trip to V&A to see an excellent collection of digital artworks.
Huzzah! Finally decided to do something with this domain. You have to start somewhere, my first blog post.