Million Tree it: "Web front-end" tips, you have mastered it?

Source: Internet
Author: User


Web front-end development, new knowledge points, HTML5 new tags, performance optimizations, and the new operator, performance optimization, are you in control of these knowledge points?
1
HTML5 Multifunction Increase
HTML5 is now not a subset of SGML, mainly about image, location, storage, multi-tasking and other functions.
(1) Painting canvas;
(2) video and audio elements for media playback;
(3) Local offline storage localstorage long-term storage data, the browser is closed after the data is not lost;
(4) Sessionstorage data is automatically deleted after the browser is closed;
(5) Semantically better content elements, such as article, footer, header, nav, section;
(6) Forms control, calendar, date, time, email, url, search;
(7) new technical webworker,websocket,geolocation;
2
Browser supports HTML5 new tags
IE8/IE7/IE6 supports labels generated by the Document.createelement method,
You can use this feature to enable these browsers to support HTML5 new tags,
After the browser supports the new tab, you also need to add a default style for the label.
Of course, you can also use mature frameworks, such as Html5shim,
<!--[ifltie9]>
<! [endif]-->
3
Briefly describe your understanding of HTML semantics?
Do the right thing with the right label.
HTML semantics to make the content of the page structured, clearer structure, easy to browser, search engine analysis;
It is displayed in a document format even in the absence of CSS, and is easy to read;
Search engine crawler also relies on the HTML tag to determine the context and the weight of each keyword, in favor of SEO;
Make it easier for people who read the source code to block the site and maintain understanding of the site.
4
What are the methods for performance optimization?
(1) Reduce the number of HTTP requests: Csssprites,js, CSS source compression, picture size control appropriate; web Gzip,cdn hosting, data caching, image server.
(2) Front-end template js+ data, reduce the bandwidth wasted due to HTML tags, front-end with variables to save AJAX request results, each operation of local variables, no request, reduce the number of requests
(3) using innerHTML instead of DOM operation, reduce DOM operation times and optimize JavaScript performance.
(4) When you need to set a lot of styles, set classname instead of manipulating the style directly.
(5) Reduce the use of global variables, cache DOM node lookup results. Reduce IO read operations.
(6) Avoid using cssexpression (CSS expressions), also known as dynamicproperties (Dynamic properties).
(7) Pre-load the picture, put the style sheet at the top, and put the script at the bottom of the timestamp.
5
JavaScript knowledge points
Data encapsulation Class object: Object, Array, Boolean, number, and string
Other objects: Function, Arguments, Math, Date, REGEXP, Error
What does 1.eval do?
Its function is to parse the corresponding string into JS code and run;
You should avoid using eval, unsafe, very performance-consuming (2 times, parsing into JS statements at a time, executing once).
You can use Eval,varobj=eval (' (' +str+ ') when you convert a JSON string to a JSON object.
What exactly did the 2.new operator do?
(1) An empty object is created, and the this variable references the object and also inherits the prototype of the function.
(2) The properties and methods are added to the object referenced by this.
(3) The newly created object is referenced by this and the last implicitly returns this.

Million Tree it: "Web front-end" tips, you have mastered it?

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.