If any developers are better positioned to explore how artificial intelligence (AI) can add to their tooling, it’s frontend programmers, said Emily Nakashima, vice president of engineering at observability platform Honeycomb.
“The frontend ecosystem moves so fast, and in some ways, frontend engineers are better equipped to deal with figuring out how to bring AI into their toolset than anyone else because they’re so used to picking up new tools and figuring out how to incorporate them and use them to bring the best of all these different workflows together,” Nakashima said.
Nakashima began as a frontend developer during the jQuery era of web development. She’s a big fan of React, saying it’s done “a beautiful job of evolving the ecosystem over time.” While her background is primarily in the frontend, she’s worked the full stack and now oversees all aspects of software engineering, security and site reliability engineering teams at Honeycomb.
A lot has been said about how AI copilots can transform developer experience, but The New Stack wondered: How will it change the code itself, either qualitatively or quantitatively? We also spoke with Nakashima about what’s she seeing and how Honeycomb is using AI.
AI’s Potential on the Frontend Code: Error Handling
“I’m most optimistic about the workflows I see coming out of companies like Adobe or Figma, where they are looking at the common handoff formats between designers and developers …”
—Emily Nakashima, vice president of engineering at Honeycomb
AI has more potential to have a positive impact on code quality in the frontend than the backend, Nakashima said. The frontend production environment is much more complex and uncontrolled — it has to run on multiple mobile devices, as well as in different browsers, even different languages, she pointed out. By contrast, backend developers control their code environment, so when there are problems it’s “fairly straightforward” to understand what’s happening, she said.
“With AI’s ability to look across all of these signals and find the common element, a single frontend developer would be much more likely to find the root cause using everything that everyone else has learned about that error, versus having to go on a journey of trying to figure out [what] this message means in this context, map back to this original line of code, and bring a lot of different data points to that,” she said. “Being able to fill out the patterns is actually really helpful in a way that is not true on the backend.”
That said, she’s a bit skeptical AI will really transform the frontend in terms of its tooling ecosystem — which she said already evolves rapidly. Still, she is excited about the potential for improving the interface between designers and developers. Indeed, one of the early AI use cases The New Stack featured helped developers turn design into code.
“That’s a place where there’s a little bit of inefficiency today, and being able to have tools that streamline the communication between those two functions is an area where I really see a lot of the busy work being taken out of the process, and people being able to iterate more quickly together,” Nakashima said. “I’m most optimistic about the workflows I see coming out of companies like Adobe or Figma, where they are looking at the common handoff formats between designers and developers, looking at places where, people, in the past, were writing out these elaborate specs of ‘use this color, it’s this many pixels,’ that kind of thing.”
AI Could Aid Frontend Migrations and Upgrades
AI code generation tools could also be helpful in managing migrations and upgrades, allowing frontend developers to spend more time on the creative parts of their job.
“The things I see today that feel most exciting are taking different multi-step workflows in the UI and figuring out how you can jump from step one to step five.”
For instance, when a new version of React comes out, it can create quite a bit of work to go through an older code base and change all the things that need to be changed to use the new version and take advantage of the new framework, she explained. AI could automate some of that work in a way that isn’t possible today, she suggested.
“Engineers spend a lot of time on migrations and upgrades, particularly dependency upgrades or framework upgrades,” she said. “It doesn’t take a lot of creativity, but it takes a lot of diligence and care, and you have to understand the patterns of how you transform from one version of a particular API to a new version. I’m quite optimistic that some of the AI code generation tools could be really helpful for those sorts of chores or workflows that take up time from a frontend engineer’s day, but aren’t the creative part of the job that uses the best of their skills.”
Internally, Honeycomb uses copilot tools — they’re big GitHub users and many developers also use VS Code as their editor. It’s also experimenting with building AI-driven product elements, primarily using OpenAI, although HoneyComb is looking at other vendors in the space to see which one can provide the best experience for its customers, she said. Some of those elements are customer-facing features that have been integrated into Honeycomb’s frontend UI.
Moving Frontend AI UI Beyond the Chatbot
Right now, chatbots are the primary way AI is integrated into frontends, but Nakashima said there are a lot of places where that feels like an inefficient user interface (UI) pattern. She said she hopes frontend and web application developers will come up with other ways to integrate AI into the user interface, but she recognizes that this an area where coders have only started to experiment.
“The things I see today that feel most exciting are taking different multistep workflows in the UI and figuring out how you can jump from step one to step five,” she said. “But I do think there’s a place for more creative, visual-driven interfaces.”
For example, Honeycomb has interactive data visualizations that will draw a map of your system on screen. That would be something that could possibly be automated through AI, she said.
“It feels like it’s early days for those sorts of features. I really see people focusing experimentation on the chat workflow, because that’s what they see in these AI tools,” she said. “I hope to see a little more variety soon.”
At Honeycomb, one way they’ve achieved this is through a query builder UI, where text is entered into a form field to generate a query.
“Sometimes it can be a little hard to know how to construct that query and type the exact right things, so we allow you to give a more general text description, and then when you click, we’ll generate a graph for you,” she said. “You can just say show me a graph of all the users that had a slow experience on my web application, and then we’ll show you graphs of that.”
The post Beyond Chatbots: How AI Can Change Frontend Development appeared first on The New Stack.
Emily Nakashima, former frontend developer and Honeycomb’s vice president of engineering, says AI can mean more than chatbots on the frontend.