How To Use Llms For Continuous, Creative Code Refactoring

Refactoring utilized to beryllium constricted to a fixed group of transforms hardwired into IDEs. If nan 1 you needed wasn’t included, you were retired of luck and had to do it nan difficult way. AI-assisted IDEs pinch Model Context Protocol (MCP) instrumentality support person changed that game. Show them earlier and aft examples of a wide assortment of patterns, and they tin fig retired each kinds of transforms without definitive support for them.

For example, present is simply a punctual I’m utilizing to cleanable up XMLUI apps that make unnecessary usage of nan Fragment component:

I pointed Claude, Cursor and Codex astatine a directory pinch an XMLUI app that included uses of Fragment that should and should not beryllium refactored according to these rules. All produced nan aforesaid correct diff. A accepted attack would entail nan usage of an XMLUI parser that could separate erstwhile attributes from others (like gap) and enactment accordingly. Large connection models (LLMs) don’t activity that way; they are general-purpose shape recognizers, and 1 of my seven rules for moving pinch them is: Exploit shape recognition.

Extracting Components To Reduce Repetition

It’s easy to create a user-defined component successful XMLUI to encapsulate repetition. When you do thing once, there’s nary need. When you do it again, pinch variation, you whitethorn commencement to deliberation astir extracting what’s communal into a component. But it often takes much repetition, pinch much variation, to explain what nan communal halfway is that a constituent should embody. There’s ever been hostility betwixt letting variety hap to observe what’s genuinely communal and consolidating into much readable and maintainable code. LLMs tin easiness that tension.

Suppose you find yourself doing thing for illustration this:

<!‑‑ earlier ‑‑>
<HStack>
<VStack>
<Text variant=”secondary” fontSize=”$fontSize-sm”>Cloud Cover
<Text fontWeight=”semibold” fontSize=”$fontSize-lg”>{condition.cloudcover}%
</VStack>
<VStack>
<Text variant=”secondary” fontSize=”$fontSize-sm”>Humidity
<Text fontWeight=”semibold” fontSize=”$fontSize-lg”>{condition.humidity}%
</VStack>
<VStack>
<Text variant=”secondary” fontSize=”$fontSize-sm”>Wind Speed
<Text fontWeight=”semibold” fontSize=”$fontSize-lg”>{condition.windspeedMiles} mph
</VStack>
</HStack>

You whitethorn recognize this would beryllium better:

<!‑‑ aft ‑‑>
<HStack>
<WeatherStat label=”Cloud Cover” value=”{condition.cloudcover}%” />
<WeatherStat label=”Humidity” value=”{condition.humidity}%” />
<WeatherStat label=”Wind Speed” value=”{condition.windspeedMiles} mph” />
</HStack>
<‑‑ a caller constituent ‑‑>
<Component name=”WeatherStat”>
<VStack>
<Text variant=”secondary” fontSize=”$fontSize-sm”>{$props.label}
<Text fontWeight=”semibold” fontSize=”$fontSize-lg”>{$props.value}
</VStack>
</Component>

We’re often lazy astir applying that benignant of transform, but laziness tin beryllium a virtue. If you haven’t seen a capable number and assortment of before cases, you whitethorn not yet cognize what after should be. AI assistants tin make experimentation inexpensive and fluid.

Planning Code Changes With AI Collaboration

AWS Kiro invites you to run successful Spec mode, wherever you collaborate connected penning requirements, creation documents and task checklists. In my experience, its scope often exceeds its grasp, and I’ve abandoned respective checklists. But nan thought took clasp successful a little general measurement and is now woven into conversational usage of Claude Code and Codex.

When I asked Claude to implement an authentication gate for an app built by a novice XMLUI developer, it identified each nan user-defined components that needed to change, enumerated nan changes it projected to make and noted 1 constituent requiring typical treatment.

Customers.xmlui has a shape adjacent to nan modular but pinch immoderate differences:

– Uses contact_id for routes, but id for API URLs
– Only has “Mark arsenic inactive” (no position toggle)
– Delete APICall is extracurricular nan DropdownMenuI request to update nan constituent to support different ID fields for routes vs API calls.
Let maine do that first.

The app besides made unnecessary usage of nan Queue component, which handles batches of API calls. In this case, location was nary request for Queue because nan backend provides a batch API. The alteration entailed nan removal of extraneous worldly and nan summation of calls to nan batch API. Here was nan plan:

1. Remove nan Queue (lines 106-143)
2. Remove unnecessary variables (lines 4-7): var.action, var.processedCount, var.errorCount, var.completed
3. Replace nan bulk action buttons (lines 84-104) to telephone APICall components alternatively of Queue
4. Add APICall components pursuing nan shape you described:
– POST /contacts/active pinch body: {contact_ids: […], organization_id: 906441453}
– POST /contacts/inactive pinch body: {contact_ids: […], organization_id: 906441453}
– DELETE /contacts/{ids} for bulk delete

In this case, things went precisely arsenic planned. Often they don’t, but nan conversational style of AI-assisted coding helps maine set nan scheme arsenic activity proceeds.

Limiting Software Liability With Cleaner Code

As Cory Doctorow precocious observed, code is simply a liability (not an asset). Tech bosses, he says, don’t cognize this.

“They deliberation they’ve recovered a instrumentality that produces assets astatine 10,000 times nan complaint of a quality programmer. They haven’t. They’ve recovered a instrumentality that produces liability astatine 10,000 times nan complaint of immoderate quality programmer.”

For Bruce Schneier, specified liability entails legal and financial risks that package makers will request to mitigate pinch security policies that make it costly to vessel insecure aliases different flawed products. Will AI-assisted coding summation package liability? Of course, erstwhile utilized improperly. But 2 things tin beryllium existent astatine nan aforesaid time. Thoughtful usage of AI tin besides thief america trim liability by making it easier and safer to do nan continuous refactoring that keeps codebases thin and clean.

Applying Creative Insight With AI Assistance

With nan extraneous uses of Queue removed, location was still repetitive usage of APICall to instrumentality a akin shape crossed a suite of user-defined components. How to consolidate, fixed that APICall can’t beryllium packaged successful a declarative user-defined component? I realized that APICall‘s imperative, relative Actions.callAPI, tin beryllium utilized successful onClick handlers, obviating nan request to state abstracted APICall components. That wasn’t an contiguous win; it conscionable shifted declarative properties to imperative arguments. But successful nan imperative domain, it became easier to specify families of arguments for different cases. When handling a batch of items, for example, an action’s sanction mightiness beryllium Mark arsenic active aliases Delete, its in-progress connection mightiness beryllium Marking arsenic active aliases Deleting, and its completion connection mightiness beryllium Marked arsenic inactive aliases Deleted.

Encapsulating that variety successful a usability made nan codification cleaner, but led to a caller refactoring challenge. Each constituent needed a version of nan function. How could they stock a communal one? AppState provides a world key/value shop that’s visible to each user-defined components successful an app. It’s typically utilized to shop elemental values, but I realized it mightiness beryllium imaginable to shop arrow functions there, too. LLMs won’t observe that benignant of creative insight, but erstwhile you do, they tin thief you validate and use it. In this case, Claude wrote a speedy trial to beryllium it would work, past merged a family of akin functions into a communal world function.

The ‘Less Is More’ Approach To Coding

The astir memorable point Bill Gates said to me, successful a long-ago interview, was: “It’s each astir penning little code.” LLMs emotion to constitute code, and erstwhile utilized indiscriminately, will create much than we want aliases need. Code is a liability. It’s connected america to rein successful nan generative small heart of LLMs and attraction them connected nan refactoring needed to limit that liability. We determine erstwhile and really to refactor, they do nan mechanical transformations — it’s a continuous conversation. Tools built to make immense amounts of codification can, paradoxically, thief america constitute little of it.

Group Created pinch Sketch.