As a hobbyist, I have been full of negative emotions on the Web Front-end, and various pitfalls are as follows: Differences and compatibility between different browsers. Differences and compatibility between old and new versions of the same browser. Layout problems: horizontal center, vertical center, multi-column height, multi-column width, floating, and so on. Clear separation between html content data, CSS rendering, and JS scripts (CSS animation and JS animation ). Poor animation execution efficiency, video and audio manipulation, and other weak questions: W3C and other standardization organizations have been engaged for N years. Now HTML5 + CSS3 + JavaScri is a hobbyist, I am already full of negative emotions on the Web Front-end. The various pitfalls are as follows:
- Differences and compatibility between different browsers.
- Differences and compatibility between old and new versions of the same browser.
- Layout problems: horizontal center, vertical center, multi-column height, multi-column width, floating, and so on.
- Clear separation between html content data, CSS rendering, and JS scripts (CSS animation and JS animation ).
- Animation execution efficiency, video and audio operations
A weak question: Has W3C and other standardization organizations been busy for N years? Can HTML5 + CSS3 + JavaScript meet our needs? Do you really want to work for the front-end or try to break her down? In particular, there are a lot of CSS attributes. In fact, they are not easy to use. They are not easy to use !!!!!
I once liked Flash very much, because she can express it in all platforms, and various la s can be used as desired, animation execution efficiency is very high, and audio, video, and even 3D can be well controlled, you don't have to worry about compatibility issues at all.
I would like to ask you: what are the most advanced front-end technologies? Is there a technology that makes us feel better? In the future, will browser development bridge the gap between compatibility? Reply: analyze the five pitfalls proposed by the landlord.
1, 2 indicates compatibility issues. I personally divided the compatibility issues into simple and complex compatibility issues.
Simple compatibility issues can be avoided through writing. Generally, the code written by an intermediate engineer is compatible with the entire platform, and the test compatibility is also slightly adjusted.
Here are some examples of simple compatibility:
There are several ways to create a triangle. The simplest one is undoubtedly using: before AND: after pseudo objects. However, earlier versions of IE do not support pseudo objects. There are several ways to create a triangle. The simplest one is undoubtedly using: before AND: after pseudo objects. However, earlier versions of IE do not support pseudo objects.
In this case, you can append the DOM and use special characters ◆. You can also cut the graph at least, which is compatible.
Another example is the vertical center problem mentioned in Topic 3.
Is an existing method and compatibility table for solving vertical center.
I personally like Absolute Centering and inline-block most often. From the figure, we can see that Absolute Centering I personally like Absolute Centering and inline-block most often. From the figure, we can see that Absolute Centering
Not fully compatible. In this case, I will use negative Margin to write a few pieces of IE7 compatible code. As for IE6, it is required to be compatible during a certain degree of practice, then it will be no longer compatible.
It can be seen that the vertical center problem is not a problem, but a fully compatible solution.
Let's talk about the complex compatibility problem. What is complicated? My personal definition is that the earlier version of IE is not supported at all. To do compatibility, a large amount of code is appended or even not compatible with writing.
For example, the three animation attributes transition, transform, and animation of CSS3 can be used to write compatibility across the entire platform through javascript. However, the complexity is not just a matter of a few minutes, but a lot of compatible code needs to be written.
Another example is the new HTML5 XMLHttpRequest standard, which provides FormData for JS to simulate form operations, and FormData can be used to asynchronously transmit binary data. The common practices for compatibility with earlier versions are iframe or flash. The iframe method cannot meet the requirements of frontend preview or progress upload feedback. The flash method can be used by some molding components, but it is not suitable for deep customization. The deep customization method is much more complicated than some HTML5 writing methods.
The above two are examples of complex compatibility issues.
Basically, all simple compatibility problems can be solved to meet the vast majority of development requirements in the existing project. The complex effects of self-testing are much more, less used in engineering.
Let's look at Article 3. The subject is known as the layout problem of egg pain.
Layout is a common problem for the front end. The multi-column height mentioned in the preceding section can be changed by using the Absolute Centering vertical center. The vertical center has already been mentioned. The horizontal center can be easily done by the intra-row blocks, and the multi-column width floating and intra-row blocks can be solved.
To solve the problem clearly, you have to call it an egg problem. You can only say that you are not involved yet, and you need to continue to sharpen it.
As for separation and efficiency, let's talk about compatibility.
The browser is only a host environment, and JS is also a subset of elasticsearch instances. @ Chris also mentioned the development of many other platforms. For example, the frontend and backend of node-webkit package to provide cross-platform solutions and WebView calling by apps are all attempts by the front end to penetrate into other platforms.
JS commercialization is too early, and browser standards are also divided by browser vendors for their own interests. Leading to the coexistence of the entire industry's dregs and essence, as well as the scarcity of cheap and master front-end industries. Today, JS has passed the original Society of copying and pasting special effects, and various front-end standards are gradually becoming more standardized.
At this moment, just as there was a bright moment, the subject said that she had filled you with negative emotions before, it must be that love is not deep enough. Compatibility: many projects do not need to consider ie at all. All new APIs can be used for mobile Web pages.
Css is not easy to use: in fact, the layout and center problems are easily solved with flexbox.
Animation efficiency: the DOM mechanism is really slow. If CSS 3 is used for animation, there is gpu acceleration, and there is no problem of smoothness, which is a little limited. Mobile devices support css3 animation and do not support flash. Who do you mean is more resource-saving and more efficient?
It turns out that the landlord is very fond of interaction and there is nothing to do with the cool web page effect. It implements some css3, and canvas can do a lot of things. Let's take a look: CodePen-Front End Developer Playground & Code Editor in the Browser
Poor browser compatibility? Line, start with Node. js. No compatibility is required for Web backend, node-webkit desktop applications, and WebView development-you can simply write code on a platform.
What? Isn't this a front-end? Well, it's time to plan your career and what you want to do. You see, there are so many Chrome and Firefox web apps outside China, you can also find a web app for foreign markets, as long as it is not designed too poorly, it is okay to make a little money. Furthermore, it is also good to create a library, framework, or something to mix R & D classes.
Still unhappy? That ...... Let's go.
Joking.
With the emergence of Chrome, front-end technology began to accelerate development, and IE was forced to speed up its pace. Thanks to the needs of mobile platforms, the development was faster ?), W3C cannot keep up, but this is just a pain. A large number of excellent features began to be added to ES, CSS, HTML, and the shares of earlier IE versions were further compressed, IE8 shares are not very advantageous in themselves. In addition, the next generation of Windows may have a free version. In the built-in halo, IE8 and 9 will only disappear faster.
Compatibility, and it will not be a problem soon.
In terms of new technologies, such Gulp and Browserify are all very interesting technologies. HTML5 Gaming, and some other things that explore the limits of CSS Animation, the front-end is still very interesting.
Supplement: Although I do not like 360 browsers very much, one thing that is quite right is that it is worthy of applause from the 360 team, that is, they provided' 'Tag, which is used by websites to forcibly use WebKit to render pages. If more browser vendors support this tag, you don't have to worry about IE8 anymore. The Compatibility specification was originally part of the technology. As a developer, I graduated last year. However, four projects have been created. I am engaged in java development, including the back end and front end. The future development trend is that js will surely shine brightly, whether on mobile phones or PCs. The design of the page is very important. This is the case for the artist. We are responsible for displaying their design in html and css, which is not difficult. Good results can always catch people's eyes. Js. Although html5 is currently not used much. Many browsers do not support it, but it is very convenient. I think this is the trend. Therefore, the WEB Front-end is promising. This is an old story ...... Thousands of years ago ...... Compatibility already exists ...... It's just that ...... Not noticed ...... Later, ie came out -. -Chrome came out ...... People gradually discovered the compatibility. During the fierce war, a mysterious magic clan emerged. They attempted to firmly believe that they could eliminate the compatibility of all evil, and proposed the standardization ...... This is the w3c family that has been praised by the world, But ie does not compromise. It sticks to its own evil nature and derives future generations to continue the struggle with compatibility.
Ie6, was born. In, ie8 and chrome had a desperate fight .. in the war for js parsing speed, chrome won, and the ie family realized its weakness. Then, they shook hands with w3c, ie9, ie10, ie11 will gradually follow standardization as a front-end programmer starting from the internship. I would like to answer this question well.
First of all, at the beginning and now, the biggest purpose and advantage of the Web is to display data, articles, some simple forms, simple interface layout, and so on.
In short, it is a content-based application,Like portal websites or zhihu, It is very suitable for using Web Front-end technology to implement interfaces. However, the future of Web is not limited to this. I have my own opinions on the future.
The compatibility issues you have complained about do not exist when IE6 excludes the world. At that time, the Web Front-end was also very beautiful.
However, the subsequent development is more and more unexpected.
First, yes
Hardware performance and network speed. After the upgrade, you can enter a Web site to open an application. You don't have to wait too long and the hardware performance keeps up. In this case, why do you need to use a client? In addition, the web has a huge advantage of being updated at any time.
The subsequent development is that all the software previously implemented using the client will be implemented using the web Front-end technology.
However, the browser does not provide so many interfaces, so the browser manufacturer is now ready. W3C is also busy developing specifications.
This is what happened a few years ago, so we have the current situation. W3C implements standards every day, browser updates, and proprietary features.
The above answers your questions 1 and 2.
---------------------------------------------------------------- Split line -------------------------------------------------------------
3 and 4 problems you primarily spit out the CSS layout and HTML-CSS-JS separation aspect.
First,
In my opinion, this is the best design in the entire front-end technology.
CSS layout is really not complex, and will become simpler in the future. At least it is much simpler than writing interfaces in programming languages.
As for HTML-CSS-JS separation, you can think it is simple
Code decoupling,Each part of the code performs its own duties. In the aspect of CSS animation JS animation, animation should belong to the CSS part, but CSS is still in development. So with JS, we have achieved some animation effects, and I believe it will be fewer and fewer in the future, JS will also focus more on the logic rather than the performance.
As for the efficiency of animation execution and video and audio, this is just a development. We must be patient. Now it is indeed a pitfall.
---------------------------------------------------------------- Split line -------------------------------------------------------------
You also compared the current front-end technology and Flash technology.
In my opinion, Flash is now playing HTML5 in gaming, animation, and other fields. However, Flash is from Adobe and HTML5 is from everyone. If Flash works, other vendors can do more such things (SilverLight). In the long run, HTML5 can also achieve Flash.
Then the subject asked what the most advanced front-end technology is. This should be unsolvable.
Then, regarding browser compatibility in the future, I think there should be compatibility problems, but it is not as serious as it is now. It should be met by all W3C standards, however, they all have their own private functions.
Finally, with regard to the future of front-end technology, I feel that as browsers become more advanced and the network speed becomes more and more powerful, Web Front-end will govern the front-end presentation of all software products. So it is very promising. The Web is now getting lost on the JavaScript Road. The crazy use of js construction makes the front-end more and more complex. The traditional B/s architecture is moving closer to the c/s territory. Data Binding and various preset controls seem to return to the VB6.0 era. The future development may be due to the increasingly low browser development efficiency and the emergence of more native applications. The Client/Remote API-based model shines brightly. Mobile phones have basically started, and desktop may need some well-known companies to drive the technology trend. Confucius said that every 18 months, the difficulty of front-end technology will double that of the web Front-end, html5 and so on may shine in the future, but this does not mean that flash will be suspended, however, some functions overlap between the two. Besides, flash is not only involved in web Front-end.
This is not the first time that the flash program is about to die. Every time a new technology comes out, it's so loud that it's been so busy for so many years and it's still not a good job, the worst case is that flash becomes a conventional technical solution ~~
