0 reply: if the scope of consideration is only the browser applications on the built-in browser and the mobile phone (safari, chrome), there are several differences:
- The most prominent difference is that the front-end should pay attention to the sharing function! Before going online, every page should basically review whether the sharing function is complete.
- A new interface has been provided recently, so more closely bound features will be available in the future.
- Html5 interfaces. Safari and chrome provide more html5 interfaces, while the built-in browser has fewer interfaces, most impressive being usermedia. A few days ago, I found that the support for fixed positioning is still not good enough, and safari is much better now. Therefore, if you want to improve the web application experience, the iscroll module is inevitable.
- The compatibility of browsers is obvious on android. Samsung's model does not support background-size-cover. You must use-webkit-background-size.
- Issues in Development and debugging. Android chrome is better and supports remote debugging. There is a solution to the problem. In case of a thorny problem, modernizr is generally used for feature detection or remote log tool debugging. Related tools include:
- Console. Re | Remote JavaScript Development Console
- Sentry: Track exceptions with modern error logging for JavaScript, Python, Ruby, Java, and Node. js
- Modernizr Helper
H5 has to call many built-in interfaces through JSSDK, which is not available in the web version.
The small differences between the two pages are the differences between webview and mobile browser.
1. on iOS, the pages opened in Safari will stop rendering and run js after entering the background, but the pages opened in webview (including webview) will be stopped, when an application enters the background, it does not stop rendering, js running, page visibility changes, or even the frame rate. The page runs normally until the application is killed due to insufficient memory.
Because of this, there seems to be no way to know whether the webpage is in the background.
P.S. in fact, the frame rate is not completely unchanged. When webview enters the background, it will have a very short behavior of suddenly decreasing the frame rate, based on this, I wrote a demo to determine whether the page enters the background by analyzing the frame rate changes. The results are good. (Note: This behavior does not seem to be directly caused by performance. I run the demo on a simulator with very high performance, and the frame rate change is similar to that on a real machine ). However, there are too many factors that affect the frame rate, and I don't know the principle, so there is no value.
2. if a target = "_ blank" link exists in an iframe of webview, we expect the link to be opened on the outermost page after clicking, however, some Android devices directly open the link in iframe, and some Android 4 or above also have this bug (the standard should be regarded as a bug ).
This is what I learned during my internship with alimama. At that time, I found that the iframe advertisement we run in webview was directly opened in the small iframe box when clicking in some Android machines, very pitfall.
Up to now, I don't know the reason for this behavior. The android friends @ and Lin Yue said that some manufacturers may modify webview because of this.
I suddenly felt that I was a little confused. There are many customized platforms, such as cloud, www. gaohuodong. me, maka, initial Page ......
See if their cases will help you ~ H5 is more capable of self-marketing, with the virus spreading function, with a sense of introduction, more emphasis on immersive experience, focus on guiding logic, tell stories to ask questions, lead participation, and induce forwarding, what should I do if I log on to the h5 page with a strong split of groups? A QR code is displayed when you log on to the webpage. You cannot directly call up the method by clicking OK. Does a general webpage refer to a general webpage on a mobile phone or on a pc?
--- The following are the pitfalls of cainiao's work ---
Ordinary mobile phone built-in browser
1. The viewport for the design draft is set to 640, and cannot be scaled. Normally displayed in [automatically scale the page to full display], but there is a problem with the built-in mobile phone browser display, especially because of the pixel relationship of the iPhone, the page width exceeds the visible screen.
2. The placeholder is invalid when the input type of the android browser is set to number or number.
PC page
1. Because the select box on the pc end cannot change the style, p is used to simulate the situation. [Do you like to use it as a designer, pretty?]
But on the mobile phone page, you can use the select statement Honestly [You can simply change the style, as long as it is not too fancy]. Otherwise, the select box of the mobile phone cannot be called.
2. image loading and low speed, especially low speed, are more important. Are these interfaces available to use http://mp.weixin.qq.com/s? _ Biz = MjM5NDAwMTA2MA ==& mid = 209208141 & idx = 1 & sn = 1f075212b3482900bb7096ac810dc7f3 & scene = 2 & from = timeline & isappinstalled = 0 # rd
