April 2021 Summaries

The Netlify team has been busy, publishing updates on new features, including On-demand Builders, a solution to improve build times for large sites, as well as the launch of the Headless Commerce Summit. The company also announced Native TypeScript Support for Netlify Functions and showcased its commitment to the Jamstack ecosystem with various product news and updates, such as Essential Next.js plugin support, modern faster Netlify Functions, and more. Additionally, Netlify welcomed new customers and published case studies on how it has helped teams grow their web development workflows. The company also shared updates on dark mode, essential plugins, and other features to improve the user experience.

Netlify's CEO Matt Biilmann delivered a talk at React Summit called "Keeping It Simple," which discussed the challenges of maintaining simplicity in Jamstack architecture while dealing with increasingly large projects. The solution proposed, Distributed Persistent Rendering (DPR), involves taking critical pages at build time and persisting them for on-demand rendering, ensuring atomic deploys and predictable state. DPR is a concept that evolves one of Jamstack's fundamental principles and builds upon existing solutions, aiming to make it easier for developers to reason about the state of web properties while keeping it simple. The Netlify team invites the community to participate in the conversation and provide feedback on the DPR approach through an open Request For Comments (RFC).

Netlify has made significant product improvements in April 2021, including On-Demand Builders for faster build times on large sites, Netlify Labs for in-app beta testing, and auto-detection of Next.js for improved development cycles. Other updates include native TypeScript support for serverless functions, dark mode, modern and faster Netlify Functions, zero-config deploys, a Netlify Functions playground and examples site, linkable log lines, function logs color coding, and auto-scroll pause. These changes aim to improve the overall experience of users, enhance productivity, and provide better tools for developers.

Today, Netlify is announcing a beta release of its Essential Next.js plugin that introduces support for On-demand Builders in your Next.js site automatically. This feature allows you to build a page on demand once, then serve the cached result to subsequent requests, shortening build times and rendering content on demand without giving up the benefits of the Jamstack. The new feature is part of Netlify's efforts to achieve Distributed Persistent Rendering (DPR), which would allow for faster deployment of large sites while maintaining the simplicity of the Jamstack architecture.

This week, we're featuring the Hugo Cache plugin in our series highlighting Netlify Build Plugins. The plugin caches Hugo's resources folder after each Netlify build, significantly improving build times by pulling resources from a cache instead of generating them all over again. This can be particularly beneficial for users processing large amounts of images or other resources in their Hugo builds. By installing the Hugo Cache plugin, developers can experience huge build speed improvements and persist their Hugo resources folder between Netlify builds.

Netlify has introduced native TypeScript support in Netlify Functions, allowing developers to build serverless functions with the same powerful workflows as they do for their application. To get started, add the `@netlify/functions` module to your project and create a function by placing a file with the `.ts` extension in your functions directory. The new feature uses esbuild to compile TypeScript functions, and Netlify Dev can be used to develop these functions locally without additional tooling or configuration needed. The build system does not perform type checking on files, but most modern code editors can handle this task, and users can enable the `esModuleInterop` and `isolatedModules` properties in their TypeScript configuration file for better compatibility. With native TypeScript support, developers have more flexibility to write serverless functions in their preferred language, whether it's TypeScript, JavaScript, or Go.

Distributed Persistent Rendering (DPR) is a new approach to the Jamstack that aims to bring faster builds without introducing unwanted complexity. It centers around an intuitive mental model, building upon the atomic deployment principle of the Jamstack, where every git push runs a build process to create its own atomic deployment. DPR allows developers to defer rendering any given URL or asset until it's first requested, bringing the benefit of faster builds and maintaining the core principles and benefits of Jamstack. It strikes a balance between new capabilities without introducing new complexities, making it an exciting development for the Jamstack community.

Today, Netlify is announcing On-demand Builders, a new solution that improves build times for large sites on Netlify. This release represents the first step forward in a significant evolution of the Jamstack architecture to support larger websites and faster development cycles across any JavaScript framework. The goal of On-demand Builders is to reduce build times so teams can iterate more quickly, while also enabling developers with huge sites to split their site's assets into critical content that's automatically compiled and deployed as part of their traditional Netlify build process, and deferred content built using an on-demand builder when a site visitor requests it for the first time. This approach is designed to work with any framework, including Next.js, Nuxt, and Eleventy, and can be used in various web projects such as e-commerce sites, publishing or media sites, and dynamic applications that generate content based on user request. On-demand Builders are currently available in early access with some constraints, but Netlify is enthusiastic about the future of this solution, which aims to address pressing issues facing developers building large sites and realize the full potential of Distributed Persistent Rendering.

Netlify recently held a seminar on migrating from legacy web architectures to the modern web, bringing real-world experience from teams who know how to adopt modern web architectures quickly, safely, and effectively. The event covered topics such as the Onramp to the Jamstack, why it's beneficial, and how to get started with a step-by-step guide. Senior Solutions Engineer Bhavana Srinivas shared her team's guide for enterprise customers undertaking this type of migration, including important upfront questions teams need to consider while moving from a legacy stack to the Jamstack. The seminar also featured a successful migration story from Crossroads Church, where they employed agency Ample to help them migrate from a legacy system to the Jamstack, resulting in improved user experience and development team productivity. Additionally, there was a fireside chat with chaos engineering company Gremlin, discussing their migration to the Jamstack and how they use Netlify's features to ensure production remains bug-free.

The technology team at Pan Macmillan, a world-renowned publisher of books, recently migrated their legacy .NET CMS to Netlify's Jamstack architecture. This change has dramatically improved site speed by 8x, improved SEO rankings, and enabled the team to ship new content and changes instantly. The migration was driven by the need for faster performance, scalability, and cost-effectiveness. Pan Macmillan's small in-house team was able to leverage a Git-centric workflow provided by Netlify, which empowered them to work more agilely and efficiently. The team has seen significant improvements in site speed, conversion rates, and engagement metrics, with 25% increase in clicks to retailers and 29% increase in SEO traffic. Additionally, the migration has enabled Pan Macmillan to cut their hosting costs by half and reduce their development hours by 20%. The team is now able to deploy new content and changes quickly, without downtime or worry, and is excited to take on future projects with Netlify's A/B testing capabilities.

Netlify has introduced a new feature that allows users to customize their user avatar directly within the Netlify app, without needing to hook their account to a Git provider. This update provides more flexibility and personalization options for Netlify collaborators, who can now upload, add, or remove their avatar using images or gifs. Users can configure this setting by going to User settings > General > Personal information > Edit settings, then selecting Upload image. The new feature supports both still images and gifs, allowing users to personalize their profiles with a custom image.

The Sentry Build Plugin is a Netlify Build Plugin that automatically notifies Sentry of each Netlify deploy, allowing developers to monitor their code errors in real-time. With the plugin, Sentry can upload source maps and send commits with suspicious code labels, enabling teams to quickly identify and fix issues. The plugin also enables easy rollbacks to previous versions of the site, optimizing engineering work and improving user experience. By using Netlify and Sentry together, Outfit7 is able to deliver fast and efficient updates to their mobile app development process.

To address the operational analytics challenges, Netlify's data team partnered with Census to automate "reverse ETL" or operational analytics. By setting up syncs between their data warehouse and destination SaaS services like HubSpot using dbt Exposures, they reduced engineering overhead and now have automated workflows for new developer onboarding. They also implemented hourly syncs to ensure updated data within an hour after production runs, leveraging Census's pricing model that is based on the number of connectors rather than syncs. This approach has generated value by working with their data, unlocking more automated workflows.

Migrating DNS for a production site doesn't have to be terrifying, it's about managing the period between when DNS records point to an old host and then Netlify. Before go-live day, check which hostnames and sites will be migrated, ensure no blocking Let's Encrypt certificate issues, and set low TTLs for new DNS records that point to Netlify. Get a custom SSL certificate before switching DNS records to cover the site during propagation or before any DNS changes. Test the custom certificate before updating DNS records, then update the A record and CNAME values to point to Netlify's load balancer. Once migration is complete, get a Let's Encrypt SSL certificate from Netlify, which will automatically renew every three months without interruption of service.

Netlify has introduced a new feature that allows customers to turn on dark mode, giving them more options for personalizing their preferences. The company's internal innovation day, Netlivation Day, and its beta testing area, Netlify Labs, played key roles in the development of this feature, which was made possible by recent refactoring of the Netlify UI codebase and moving to Tailwind. With dark mode now available, teams can better use Netlify within their workflow and choose an environment that works best for them, regardless of time zone or lighting conditions.

The incident occurred when a Google Cloud TCP load balancer in the us-west1-c region failed, causing around 5% of Netlify's global traffic to be disrupted. The issue was due to a bug in Google's networking agent that removed a custom route table entry, preventing the backend nodes from responding with the correct IP address. To mitigate the incident, Netlify implemented alternative IPs for enterprise and self-serve customers, and eventually restored all traffic after restarting the GCP networking daemon on affected nodes. The resolution of the incident was delayed due to a simultaneous cloud provider outage in the same region. Netlify is now patching the guest-agent systemd config to listen to systemd-networkd restarts and expanding its load balancer monitoring to include backend health checks. Additionally, improvements are planned to be rolled out this year to further improve reliability, scalability, and mean time to resolution.

Netlify has been working on improving its serverless workflows, specifically the Netlify Functions feature. The new updates include a faster bundler using esbuild, which optimizes JavaScript functions by discarding dead code and filtering dependencies. This results in smaller and more performant functions. Developers can opt-in to test the new functionality now or wait for it to be enabled during the week of May 17. To use the new bundler, set the `node_bundler` property to "esbuild" in the `netlify.toml` configuration file. Additionally, Netlify has introduced an advanced configuration section to handle edge cases, such as dependencies that can't be inlined, and support for ECMAScript modules syntax. The new features aim to provide a better serverless workflow experience for developers.

Netlify has announced the retirement of its integrated community content feature, Netlify Stories, after overwhelming customer demand. The feature was launched as part of a campaign from customers who told Netlify what they wanted, and it allowed users to share stories and experiences on their Team Overview page. Netlify Stories were available exclusively to those on the starter plan and positioned Netlify as the latest entrant into the "ephemeral chatter via colorful circles at the top of the page" category. The feature's retirement marks a new day for Netlify, which will continue to listen to customer feedback and incorporate it into its features.