Following on from one of my most popular posts - Is The M1 MacBook Air Good For Web Development? I thought it would be a good idea to make a post on the Air's bigger brother, the 14" MacBook Pro. I've been using an M1 Pro for my day job for a little over a year now, so I'm in a good place to let you know all about it.
Jumping straight to the point just like my last post. Yes, the M1 14" MacBook Pro is fantastic for web development. And if you shop around, you can still pick them up for £1700 - £1800 which is great value.
It's also worth pointing out that this blog will also apply to the newer M2 model as they are almost the same apart from the M2 offering more performance.
Why is the M1 MacBook Pro good for web development?
For starters it's more powerful, but you probably already knew that. I'll get to the performance part later on. What I want to explain is what you're getting for the extra money.
How good is the display?
One of the first things you'll notice with the 14" MacBook Pro is that the screen is fantastic. It offers a 120hz refresh rate (which you can change to lower settings if you desire) which makes scrolling and animations silky smooth. It also uses mini LED technology which helps with the battery life and also allows the screen to reach a peak brightness of 1600 nits. If you are comparing the 14" Pro to the Air, the Pro definitely beats it.
This also translates nicely when coding as the text is super crisp and the screen brightness can go high when needed.
Not to mention its 14.2" display also gives you more screen real estate, meaning you can fit more code on your screen. My personal opinion is that the 14" MacBook Pro is in the sweet spot of screen size and portability.
It supports multiple external displays
One of the drawbacks of the M1 and M2 MacBook Air's is that they only support 1 external display. Not really a deal breaker, but if you need two or more displays for your development work, the Pro offerings are the ones you have to choose.
It has more port options
It wasn't going to be hard to beat the Air in this department, seeing as though the Air doesn't have any additional ports that you'd need. The 14" MacBook Pro has an HDMI port and a SDXC card reader slot. So this reduces the need for adapters and dongles. Whilst this doesn't really apply to web development directly, it means you have less cables and things to carry around with you. A clean, clear workspace can definitely improve your performance.
The keyboard offers a great typing experience
The keyboard on the 14" MacBook Pro has a very premium feel to it. Comparing it to the M1 Macbook Air, the keys are more steady. On the Air the keys have a very slight movement to them. If you were to rest your fingers on any of the keys you can move your finger around and they'll wobble about ever so slightly. The 14" Pro doesn't have this and the keys feel solid and also offer a little more travel when pressing down. There's also a nice sound as you actuate - Don't worry no loud clicking sounds like those mechanical keyboards, more of a nice thud. Hard to put into words, but it feels nice on the fingertips! Overall it offers a great typing experience which is essential for any sort of web development.
It weighs more than the Air, but it's still comfortable on your lap
It weighs in at 1.60 kg (3.5 pounds) compared to the M1 Air: 1.29 kg (2.8 pounds). Yes you can feel the difference when you pick it up, but it's not offensive. It just feels like a quality product. I routinely swap between the 14" Pro and my own M1 Air and the difference in weight is hardly noticeable when you've got it on your lap.
The base models come with 16GB RAM and 512GB SSD
As the heading states, the base model (often known as the cheapest) gets you a decent 16GB RAM and 512GB of SSD space. Apple wants another £200 each to upgrade the RAM or storage of your device, and if compared to the Air - that's a whopping £400 more to get the same RAM and storage. It's a bit of an insult really. The base specs should be fine for web development, even if you need to throw Docker in the mix, the 14" Pro takes it all in its stride. If your workload requires more, it's worth upgrading, but as it stands the base model should last you 5+ years easily.
The performance is great
One of the things that I often found myself thinking was that the M1 Air might not be powerful enough for my workload. But as I explained in my Is The M1 MacBook Air Good For Web Development? post. The Air smashes through anything I throw at it. Yes, the 14" MacBook Pro is faster than the M1 Air, and you can notice it when running tests and opening programs. I use PhpStorm as my main IDE and the 14" Pro opens up quicker and more importantly indexes the project quicker than the Air. I don't use Docker very often, but when I do, I'd prefer to have the 14" Pro on the job vs the Air. It's just quicker which is important as Docker can and will be a resource hog.
I often work on a Next.js / React project. One of the things I notice is that when running npm run dev the hot reloading and page navigation when using the 14" Pro is quick. I've done the same on other older laptops and you can really feel them struggling. Page loads take a few seconds sometimes, whereas with the 14" Pro is near instant.
For everyday web development the Pro is lightning quick, but I feel it will really shine when you've got a more demanding workload to throw at it. If this is the case for you, I'd definitely recommend the 14" over the M1/M2 Air's.
My final thoughts on the M1 14" MacBook Pro for Web Development
For web development of any kind the 14" Pro will offer you a fast and reliable experience for years to come. This is a laptop that will last you 5+ years. If you can afford it, I highly recommend it. You can get a refurbished 14" M2 Pro from Apple or you can get a slightly discounted one from Amazon.