Front technology development is very rapid, a lot of projects are faced with front part to reframe, very happy can let what I have this project front reframe plan is made up.
Structure of one.1 page
Be in charge of what PC carries reframing, combed page structure and the relation between first so, paint good form composition of a picture with Xmind, key function makes number, because Vue is frame of advance gradually type, I will be so preferential the part with reframe important
Xmind writtens guarantee I did not get on composition of a picture, professional personal integrity still wants
1.2 projects structure
Project structure organizes a structure in the light of code, the content that combed a project to each important folder reachs a document and make clear correspondence or action. Same, use Xmind picture gives knot composition of a picture, xmind pursues slightly.
1.3 front frame, pattern plate
Use company in-house staff achieves frame C.F.F oneself, define Build file oneself, smarty pattern plate is embedded to get tiring-room data inside, use {$xxx} to get tiring-room data, but defined data of pattern plate of memory of variable of a lot of overall situation, cause take up more memory, pollution names the problem such as the space.
Define communal component to be called for each module or specific setting, answer expense is high
Library of 1.4 tripartite, component, plug-in unit
2, reframe plan
2.1 development are normative
This thing was not opposite the standard absolutely wrong, perhaps make normative everybody keep consistent only with the company with the branch, between the colleague can understand each other code very quickly, improve development efficiency
2.2 technologies type selecting
2.2.1 development mode: Around carries depart
Around carries separate development to make a trend already, use this kind of mode to undertake developing mostly to new now project, if the project reframes completely of course first selection this mode
2.3, front code standard
1, the page in inside couplet style and head style extraction arrive in alone Css file
2, those who adjust code is retractive
3, change be like,tag the label that has not borne: ≪b>
4, the use that reduces global variable in Javascript, the scope of contractible variable
5, arrange a foundation kind library, because the problem of version creates many documents,decrease
3, front code is modular
1, press code of module classify Css and Js code, put in the folder of module correspondence
2, press code of module depart Js, the definition names a space differently
4, improve performance of page to load
1, the Javascript file delay that will not affect home page to show arrives after page to load to load
2, in deleting a page initiative hidden area
3, Javascript instead is pressed need to load
4, the lazy to load of the picture
5, the adduction that adjusts Css and Js is ordinal
6, install cache to static file
7, the file on to load CDN
8, the picture is amalgamative
There is front previously of this one position say, it is development of back end give attention to two or morethings, database, rock-bottom service, interface, page a shuttle, pressure is great, and energy is finite what cannot do in every domain is outstanding. Have later cut a figure this one duty, what can write the page is a few more elegant, cooperate to have data through pattern plate and request interface alternant, front is closely coupling at back end, this kind of circumstance issues development, communication cost, developing the plan in the process to count cost is taller. After back end departs before, division of labor is clearer, respective and dedicated the thing that has done him domain, at the same time start working, not interdependent, efficiency is tall
Have the friend that wants to seek advice, comment on beneath at any time, small make up can solve one by one, also but illicit letter is small make up " study " no matter be Xiaobai or big ox. Can obtain most systematic data.
