April 2024 Summaries

Tonies, a company that creates smart audio systems for children, transitioned to a new frontend platform powered by Vercel's Frontend Cloud and Contentful's CMS, driven by the need to expand into new markets. This strategic move improved their development, continuous delivery, and quality assurance processes, resulting in faster QA, reduced latency, enhanced scalability, and better user experience. The adoption of Vercel has had a profound impact on Tonies, allowing them to scale with ease, improve conversion rates, and extend their reach beyond European markets. By embracing modern technologies like React-based headless stack and Frontend Cloud, Tonies is now well-positioned for future growth and digital success.

Latency in web page load times and responsiveness to user action is a crucial factor affecting user satisfaction. It depends on the user's connection type (Wifi, LTE, 5G), server distance, and network quality. Low latency numbers can compound quickly, impacting overall performance. Key metrics include Wifi latency, 5G high-band and mid-band latencies, TTFB, FCP, LCP, frame duration at 60fps, round trip latencies to different locations, time to parse CSS, HTML, JS, and INP. These numbers can vary based on device type and network quality.

Global Retail Brands (GRB) is a fast-growing Australian retailer specializing in homeware and kitchenware goods with over 250 physical stores. GRB's web infrastructure was fragmented across multiple platforms, leading to challenges in maintenance, updates, and collaboration among the IT team. The company recognized the need for a streamlined digital platform to improve their online presence and customer experience. With the help of Vercel, GRB migrated to a unified and scalable solution, significantly reducing development time from months to just one week, and deploying new features in under 10 minutes. This partnership has improved site uptime to nearly 100%, enhanced performance and agility, and enabled GRB to expand its online presence through the upcoming launch of a loyalty program.

In this post, we explore how a 3D event badge with an interactive lanyard was created for the Vercel Ship 2024 site. The inspiration came from a Blender video depicting a virtual badge dropping down. To make it interactive and run in the browser, React Three Fiber, Drei, react-three-rapier, and MeshLine were used. The implementation is about 80 lines of mostly declarative code with some math involved. The final product includes physics joints, a curve for the lanyard, an interactive card, and dynamic name display.

Blue-green deployments are an effective strategy to mitigate risks associated with rolling out new software versions by allowing incremental exposure of users to new deployments and enabling quick reversion if necessary. Vercel offers solutions to challenges faced in implementing blue-green deployments, such as architectural gaps and infrastructure overhead, through its platform primitives like Skew Protection, Edge Config, and Middleware. Leveraging serverless for scalable deployments on Vercel's platform reduces overhead, increases scalability, and makes sophisticated deployment strategies cost-effective. Additionally, innovative rollout strategies such as multicolor deployments and shadow rollouts are supported by the platform.

Teleport, an open-core platform for secure infrastructure access, overhauled and migrated their documentation to Next.js and Vercel, resulting in a robust and up-to-date resource for customers, with improved site performance, end user experience, security, collaboration, and a new customer acquisition channel. The migration streamlined development, ensured brand consistency, and reduced build queue times by more than 60%, allowing for multiple daily updates and easy previewing of changes.

The text discusses the potential of composable AI in ecommerce and demonstrates its utility through a case study involving an AI-powered review summarizer. It highlights how using tools like Vercel's AI SDK can help developers build custom AI features quickly, without being constrained by their existing platforms. The author also emphasizes the importance of prompt engineering and choosing the right AI model for specific use cases. Additionally, it mentions other potential applications of AI in ecommerce, such as improving search relevance and speeding up customer support through chatbots. Overall, the text advocates for the democratization of AI development to enable businesses of all sizes to leverage its benefits effectively.

Ruggable, an online rug retailer, transitioned to a headless architecture with Vercel and Contentful to improve site performance, enhance SEO, boost conversions, and elevate developer experience. The company saw significant improvements in site speed, accessibility, and search rankings, resulting in a 300% increase in organic clicks. Ruggable's new architecture enabled the team to optimize site performance, streamline processes, and facilitate creativity and speed, ultimately leading to success in achieving zero downtime during Black Friday and delivering business impact. The company is now planning to further improve initial page load using server-side rendering and next/font, and measure improvements with real customer data.

Vercel is updating its infrastructure pricing as of April 4th, 2024. The changes include reduced prices for bandwidth and functions, more granular usage metrics for all plans, and a free Hobby tier. These updates are based on customer feedback and aim to better align with industry standards. Emails will be sent to account owners with next steps, and the new pricing will take effect during customers' billing cycles between May and June 2024.