The unofficial way to embed Squoosh into your web app.
I wanted the functionality of Squoosh, but in my web app. Here's how I did it. Read More
I lead the Chrome Developer Relations team at Google.
We want people to have the best experience possible on the web without having to install a native app or produce content in a walled garden.
Our team tries to make it easier for developers to build on the web by supporting every Chrome release, creating great content to support developers on web.dev, contributing to MDN, helping to improve browser compatibility, and some of the best developer tools like Lighthouse, Workbox, Squoosh to name just a few.
I love to learn about what you are building, and how I can help with Chrome or Web development in general, so if you want to chat with me directly, please feel free to book a consultation.
I'm trialing a newsletter, you can subscribe below (thank you!)
Putting an image on the page is easy, until it's not
It should be easier to put an image on the page. Read More
My Drafts
I want to share my thinking with you, and to refine my thoughts with feedback from developers. Read More
Web Developers. Want help? I want to help. Book a meeting with me.
After the Chrome Dev Summit, I had the chance to take some time off and spend it with my family, and during the downtime I got to think about all that has happened over the last year. I'm incredibly proud of my team and how they responded to the crisis that hit the world this year - we built tools like web.dev/covid to give developers advice on how to keep sites up and running, set up a forum for public services support during the lock-downs; ran web. Read More
Creating a quick launcher for Android using the web
The web is a powerful thing, with the right capabilities you can create tools and services that can be deployed without a central authority and can also deeply integrate with the peoples devices. I love being able to tinker and scratch an itch quickly. The itch in question was that I'm a heavy user of .new domains and I wanted a quick way to have access to them on my Android home screen so that I can start a task without having to find the app, go through its menus and then create the "new" thing. Read More
Bookmarklet to download all images on a page with the File System API
My daughter is attending nursery school and every day they post photos of the baby to a special portal so we can see what she has been doing. The web site, is, err, well... functional. However they block the ability to download the photos in their UI, I've no clue why, but it's super frustrating. I love Bookmarklet because they let me quickly augment a site without having to build a full extension, and this is no exception. Read More
FAB without JavaScript
Just after my daughter was born we needed a simple way to track "Baby Habits" (Read: Eat, Poop, Wee, Sleep, and maybe a bit of Vom). During my baby duties when the baby was asleep I built Akachan.app to help us keep on top of things. I wanted this app to load instantly, and given that JavaScript is one of the biggest contributors to a slow page load, I gave myself the challenge to build Akachan as a SPA without client-side JS (more in another post), which for the most part I was able to do this with traditional POST's and a hefty amount of Service Worker logic. Read More
Simulating Apache mod_include for Vercel
I run a static site, it's built with Hugo and hosted on the edge with Vercel. Sometimes, I just want to include a small piece of server-side logic (Copyright notice anyone?) without having to spin up a complex node server or api endpoints. Sometimes I want to be able to drop a small piece of dynamic content in one single page on my static site. That's what I loved about Apache mod_include. Read More
I finished reading my first book in Japanese today
I've been learning a bit of Japanese for a little while now and whilst I find it very hard, I was quite happy to have read this book to my daughter today though! Read More
I love that my printer advertises to me
Streaming Templates in node and the browser
I'm currently building a simple web app and I needed a simple templating engine that can stream dynamically generated responses to the network. It's hard to build sites that are fast. One known pattern for building sites that render quickly is to ensure that the browser gets the HTML as quickly as possible. Yet, many of the tools (middleware and templating engines) that developers use to build sites wait for the response from the server application to be completely created before they are put on to the wire and send to the client. Read More
Shiming Request.formData in Safari
I'm currently building a simple CRUD client-side only data logger PWA that contains no client-side JavaScript apart from what is inside the service worker. To do that I am following basic REST principles, and just using the Form element to submit data to the service-worker that then stores in it IndexedDB and renders the results back out to the client. I will explain more in another post, but in this post I want to quickly document how I fixed an issue in Safari. Read More
:D tabs open
Idly browsing the web whilst I'm on paternity leave and saw that I have a lot of open tabs. :D Read More
Twitter is using PWA shortcuts
I thought this was rather cool and I discovered it by accident, but it looks like Twitter implemented shortcuts. It's great to see web sites and web apps being able to do things that users expect installed applications to be able to do. Read More
View Source for Safari on iOS with Shortcuts
I love view-source, it's a nifty super power of the web that nearly all mobile browsers are trying to kill. Not exactly sure why. View-source is what got me into web development because I could see how other people structured their pages, and at the time I started web development it was pretty much the only way to debug web pages. I've also been using my iPad Pro whilst I am not at work for the next month or so. Read More
Quick Console bookmarklet for Desktop and Mobile
Sometimes when I am on my mobile, I just want quick access to the JS console so that I can see what is going on inside the web page: Does the page have any logs, warnings or errors etc; without having to plug my phone into a laptop and hooking up to Chrome DevTools. I really wish you could use DevTools more easily on a mobile device. That being said, I have a partial solution that solves my problem. Read More
Use Bookmarklets on Chrome on Android
I love Bookmarklets, they let you quickly customise web sites in a lighter way than a Chrome extension, and for the longest time (5 years), I thought it wasn't possible to run Bookmarklets on Chrome on Android. It turns out, I was wrong. You just can't run them the traditional way. The way that most people access Bookmarks on Android doesn't let you run a Bookmarklet, i.e, via "Select Bookmarks" in the main menu; Read More
Quick Picture in Picture Bookmarklet
Picture in Picture is an amazing API, it let's you keep on working in another tab but have a little playable live thumbnail of the video on the screen for you to keep up with. Yet there are a number of sites that disable the feature. I just wanted a quick and easy access button that I can press in my browser that will just PIP the video. So I made a bookmarklet. Read More
Getting a list of Blink Components
This is mostly for me to remember. I needed to build a mapping of DevRel support to Blink Components, and I really didn't want to have to manually work out all the components by hand. If you want to get a list of components in Blink, there is a file that has all the details you need. If you are Promise inclined, here is a quick way to do it. Read More
River Dee in Llangollen before and after heavy rain
One of my favourite activities is driving, specifically through hilly terrain, and North Wales is one of my preferred places to drive. As is my want, I normally pass through Llangollen. For those who don't know, Llangollen is a town in North Wales that is set on the River Dee, and during the summer months when it's flow is slower than normal you can go out onto the rocks and paddle a little bit (warning: the flow is still strong). Read More