A good refactoring is not easy to do how to be a good refactoring?

Article Introduction: How to do a good refactoring.

Use this title because there is an open-ended discussion in the previous group: What is a good refactoring?
In fact, "good" and "bad" has always been relative, because everyone in the eyes of the "good" and "bad" standard is not the same as from their own point of view: How to do a good refactoring?

Let's take a look at one of the most common two-column layouts we've encountered:

Basic HTML code:

To see the specific CSS code implementation (ignore margin):

It is clear that in the case of maintaining the same HTML structure, two-column layout can be implemented with a variety of CSS schemes (left column width), the main direction is to float or not to float, right column width or width:

Qzone, friends, Facebook All to the left column floating, the only difference is the right column to write, Qzone to the right column set wide and floating, and friends and Facebook did not give the right column set wide and not floating, Instead, it uses the principle of creating BFC and triggering haslayout for lower versions of IE to allow the right column to be adaptive to width.

Yahoo and Google two are not used to float, the only difference is that Yahoo used the absolute positioning method, and Google used Inline-block,google has announced that some of its products to give up the support of IE8, So Google can boldly use Inline-block to achieve layout without having to write a bunch of hack for other low version browsers.

Do you have the best plan? Each of these options has its own pros and cons, may be suitable for a project background, the same choice of programs may be related to the user community. No matter which option you choose, you can't perceive it from the user level, but we can't use a scheme at random.

For the ease of maintenance and usability of the project, it is necessary to choose the best solution, and if we do not even basic BFC, haslayout these knowledge will appear powerless. At the same time to be clear about their positioning: we are not only a "cut" or "art", we can not ignore some of the barriers of user groups, we have to make the project code more elegant and easier to use. While the basic job responsibilities of refactoring are: PSD to HTML + CSS + JS, but to know that just do it is not a good refactoring, better communication skills, more sharing, thinking and summing up, how to pay attention to some of the front end of the dynamic, this is what we need to do, Of course, the most important also need us to have an optimistic attitude and happy mentality, below I will elaborate on exactly how to do a good restructuring, of course, this is just my personal point of view, but also invited you to Pat Bricks.

From a professional perspective:

A clear positioning of oneself

At present, the front-end is divided into refactoring and JS development is not much, although PS is a necessary to refactor the software, but to know that refactoring is not "cut", Chettu is only part of the reconstruction of the work content. We have no reason because we are refactoring, and not to learn other technologies, because you know you will not do a lifetime of refactoring, JS can not be lost, the same to the front-end new technology to be familiar. Refactoring the page should spend most of the time on the page module extraction, performance optimization, easy maintenance, ease of exploration, but should spend the least time to code implementation. Perhaps the page you write out has millions users in use, there may be barriers to users, so you have to consider the feelings and experiences of various users, not just limited to the completion of the code.

Focus on front-end basic skills

The basics of the front end are like the foundation of a house, and if the foundation is badly beaten, a little earthquake may fall. At the same time also like a castle door, which side of the door is not good, the enemy's gun fire can be immediately breached, so lay a good foundation is the front end to learn more knowledge of the cornerstone. CSS attributes, HTML tags semantics, the basic knowledge of JS, the specification of the Consortium (block format context, cascading context, box model, etc.), these can spend a little more time to learn and consolidate, to be able to correctly and rationally use a front-end technology program.

Correct treatment of frontier technology

The development of the Internet is changing rapidly, front-end technology update is also very fast, when we are learning Css2, CSS3 has been popular all over the world, when we are learning CSS3, CSS4 has been put on the agenda. The front end of the road forever life-long learning, so when a new technology is born, we need to look at the right.

While doing your own job, keep a passion for learning, new technology can try to use, but please be sure to understand why use this new technology? What can be improved by using this technology? In front of the technology, there will never be the best technical solutions, only the most appropriate technical solutions. The latest is not necessarily the best, the old is not necessarily bad, should not blindly follow the new technology, to know whether they are learning to apply. (I note: In fact, more time is not a new technology, technologies have long been born, but a novel front-end solutions or standards have been pushed out, such as CSS3 in fact, in 03 was born)

Better communication skills

We may have to deal with different kinds of people, such as development, product, design, interaction, testing, etc., so this requires us to have a better communication and coordination ability, focus on a better communication skills, reduce the cost of communication. "Everything is based on the value of the user", which is also the Internet industry needs a concept, in addition to other colleagues to communicate with others, but also need more for the user to consider: we really need to do this?

[1] [2] Next page