Simon Willison’s Weblog

Subscribe

17 items tagged “frontend”

2024

Skew protection in Vercel (via) Version skew is a name for the bug that occurs when your user loads a web application and then unintentionally keeps that browser tab open across a deployment of a new version of the app. If you’re unlucky this can lead to broken behaviour, where a client makes a call to a backend endpoint that has changed in an incompatible way.

Vercel have an ingenious solution to this problem. Their platform already makes it easy to deploy many different instances of an application. You can now turn on “skew protection” for a number of hours which will keep older versions of your backend deployed.

The application itself can then include its desired deployment ID in a x-deployment-id header, a __vdpl cookie or a ?dpl= query string parameter. # 20th March 2024, 2:06 pm

2022

Defensive CSS (via) Fantastic new site by Ahmad Shadeed describing in detail CSS patterns which can help build layouts that adapt well to unexpected content—things like overly long titles or strange aspect ratio images, common when you are designing against UGC. # 6th July 2022, 5:16 pm

The balance has shifted away from SPAs (via) “There’s a feeling in the air. A zeitgeist. SPAs are no longer the cool kids they once were 10 years ago.” Nolan Lawson offers some opinions on why the pendulum seems to be swinging back in favour of server-side rendering over rendering every page entirely on the client. He argues that paint holding, back-forward caching and service workers have made the benefits of SPAs over MPAs much less apparent. I’m inclined to agree. # 22nd May 2022, 2:47 am

2017

Frontend in 2017: The important parts. Keeping track of developments in the frontend and JavaScript community is pretty much a full time job here days, so I found this summary of trends and developments over 2017 very useful for trying to catch up. # 29th December 2017, 8:30 am

2013

What are some ways that brought your proficiency of CSS to another level?

An exercise I found useful when I first learned CSS was to implement CSS versions of the designs of popular sites. This was back when most sites still used tables for layout.

[... 76 words]

Should I ever use GIF image format for non animated elements?

These days probably not—anything non-animated that you would use a GIF for is generally better as a PNG.

[... 37 words]

What design techniques does Apple use in the introduction page of iPad Air?

Apple used the same technique on their Apple—Mac Pro page. I first saw this trick used on the BeerCamp at SXSW 2011 page.

[... 91 words]

Is there any alternative to devbootcamp.com or hackreactor.com in Europe?

http://www.makersacademy.com/ are running a similar program in the Old Street area of London.

[... 30 words]

Is there an alternative to media queries for responsive design?

Yes: use percentage measurements for your layout components. That way you can build a website that works on a much larger range of screen sizes. You can combine this approach with media queries—for example, you could specify that your site has a 25% wide navigation menu and a 75% wide content area on devices that are wider than 400px, but any smaller than that and it collapses to a single column layout with the menu hidden and accessible only through a menu bar icon.

[... 102 words]

What are the strategies for a front end developer to keep up to date with the emerging technologies?

Step one: find developers who you respect and subscribe to their blogs, follow them on Twitter/Google+/etc and try to understand what they are talking about and what they think is exciting.

[... 139 words]

2012

How does a front end developer avoid getting blamed?

It is your fault. Part of being a good front-end engineer is knowing the ways in which a page might break and working with your team to mitigate them.

[... 138 words]

Can you mark items on a website as ’unread’ without cookies?

It’s not very exciting, but CSS will let you set different styles for visited vs unvisited links and the technique has worked reliably since the mid 1990s.

[... 44 words]

Why weren’t the features of Sass originally built into CSS?

This is not a straight-forward issue: CSS has a very long, complicated history. A good starting point for understanding the reluctance of the CSS working group to add variables/constants etc to CSS is this essay by Bert Bos of the W3C (entitled Why “variables” in CSS are harmful) http://www.w3.org/People/Bos/CSS...

[... 66 words]

Why do tech companies provide MacBooks for software development?

Smart tech companies give their engineers the laptops that they ask for. Engineers are EXPENSIVE, and anything you can do to increase their productivity is worth the money. If they prefer to work on a Mac, buy them a Mac.

[... 55 words]

How do you know the real size of a web page?

The Google Chrome developer tools can do this, on the Network tab. Take a look at the bottom blue bar (which says “5 requests | 29.49KB transferred”)

[... 51 words]

Why are front end developers so high in demand at startups if front end development is relatively easier than other fields of engineering?

You’re starting with an invalid assumption. Front end development is absolutely not “easier” than other forms of engineering.

[... 333 words]

2011

What specific skills are most important in a front-end web developer and in a back-end web developer?

Understanding of web app security. If they don’t know what XSS, CSRF and clickjacking are I’d be worried.

[... 41 words]