Qualified
Refactoring Concept (what/when/why)
What
Refactoring (noun): a change made to the internal structure of software to make it easier to understand and cheaper to modify without changing its observable behavior
Refactoring (verb): to restructure software by applying a series of refactorings without changing its observable behavior.
Refactoring is all about applying small behaviorpreserving steps and making a big change by stringing together a sequence of these behaviorpreserving steps. Each individual refactoring is either pretty small itself or a combination of small steps. As a result, when I’m refactoring, my code doesn’t spend much time in a broken state, allowing me to stop at any moment even if I haven’t finished.
TIP
If someone says their code was broken for a couple of days while they are refactoring, you can be pretty sure they were not refactoring.
Refactoring is always done to make the code “easier to understand and cheaper to modify.
When
The Rule of Three
Here’s a guideline Don Roberts gave me: The first time you do something, you just do it. The second time you do something similar, you wince at the duplication, but you do the duplicate thing anyway. The third time you do something similar, you refactor.
Or for those who like baseball: Three strikes, then you refactor.
- Preparatory Refactoring — Making It Easier to Add a Feature
the best time to refactor is just before I need to add a new feature to the code base. As I do this, I look at the existing code and, often, see that if it were structured a little differently, my work would be much easier.
- Comprehension Refactoring: Making Code Easier to Understand
before I can change some code, I need to understand what it does.
- Litter-Pickup Refactoring
a variation of comprehension refactoring is when I understand what the code is doing, but realize that it’s doing it badly.
The examples above—preparatory, comprehension, litter-pickup refactoring — are all opportunistic.
You have to refactor when you run into ugly code—but excellent code needs plenty of refactoring too.
- Long-Term Refactoring
- Refactoring in a Code Review
Why
- Refactoring Improves the Design of Software
- Refactoring Makes Software Easier to Understand
- Refactoring Helps Me Find Bugs
- Refactoring Helps Me Program Faster
Refactoring table layouts
Each element should be used for its intended purpose: ul for unordered lists, ol for numbered lists, table for tabular data, blockquote for quotations, h1 - h6 for headings, and so forth. Using the proper semantics for each element renders pages more intelligible to screen readers, and makes sure they can be displayed properly on different platforms.
In modern browsers, CSS enables much greater control over the appearance of a page. It's not merely that the fanciest sites can be duplicated in CSS. They can only be designed in CSS. Creating a modern page requires moving away from tabular layout and font tags to XHTML cleanly separated from CSS.
Remove all table layouts and replace them with div elements that linearize the content. Then use a CSS stylesheet to position the divs in the form you want.
CSS layouts are more powerful and more accessible than table layouts. They work better across a broader variety of devices, such as PDAs and audio browsers. They are more understandable to machines and thus enable better processing of content, including somewhat enhanced search engine optimization. Finally, they make it easier to edit and update pages both because the pages are simpler and because the style and content are separated so that designers don't step on authors' toes and vice versa.
CSS-based pages are smaller and simpler than table-based pages. This makes them easier to edit and easier to author. It also makes them faster to download. All those <td> and <tr> tags add up. A kilobyte here, a kilobyte there, and pretty soon you're talking about real bandwidth. High-volume sites such as Slashdot can save gigabytes per day and thousands of dollars in bandwidth costs per year by moving to CSS. Although the CSS files themselves take some bandwidth, they can be cached and reused. They do not need to be downloaded with every page.
Refactoring for Accessibility
Convert Images to Text (replace any images that contain text with the text they contain, along with the markup and CSS rules that mimic the styling)
Add Labels to Form Input (make sure each nonhidden input, textarea, select, or other form element has an associated label)
Introduce Standard Field Names (rewrite your forms and form processing scripts to use conventional names for conventional things such as e-mail addresses, credit card numbers, phone numbers, and so forth.
<input name="n2" />=><input name="email" />)Turn on Autocomplete (remove autocomplete="off" attributes where appropriate)
Add Tab Indexes to Forms (add a tabindex attribute to every editable, nonhidden form control)
Add Internal Headings (place h1-h6 elements at reasonable breaks throughout long pages)
Introduce Table Descriptions (add a caption element and/or a summary attribute to each table. Add a th element for each row or column label)
Introduce Acronym Elements (wrap abbr and acronym tags around abbreviations and acronyms)
Introduce lang Attributes (add lang and xml:lang attributes to each root element identifying the primary language of the document. Add superseding lang and xml:lang attributes to any element in that document that is written in a different language)