I have not installed Toutiao, but the main text of almost all news apps is webview. Take NetEase News as an example. It is a webview. After loading the news text, tell js to leave it blank and let the client fill in the following sharing, advertisements, popular posts, related news, etc. Or put a webview that displays the text on the scrollView, and put sharing, advertisements, popular posts, etc. below it. You should know the communication method between webview and js. As for how to package webview like client-side controls, it is actually not difficult, such as getting the total height of the page, getting the thumbnail rect, customizing the menu, setting the background of the body to be transparent, and letting customers Execute certain code on the terminal, such as sharing, opening the comment interface, etc.
This is the general idea. I made something a long time ago, which is similar to the news text page, but js can control the page arbitrarily, and supports web and native controls. The boss hopes that the client can be like a web application and can change the interface at any time, add event pages, etc.
As for what you said about passing json, passing json is just how to transmit data, but what you asked about is how to implement the interface. There is no relationship between the two.
Let’s talk a little more about page caching. Webviews that are displayed frequently such as news details pages generally require page caching. You can set rules to cache html/css/js, or package them into an app, or both. Cached pages load without any stress. If you know that the main text of NetEase news is transmitted in json, then you can look through directories such as app bundle and documents/library, and there must be page cache.
Then comes the data. The cached interface is just an empty shelf, with only styles and no data. The method of filling data is very flexible and depends on your personal preferences and actual test results. You can ask ajax to request data and then fill in p, or you can ask the client to execute js to fill it in after the shelf page is loaded, or you can let the part that does not participate in caching (such as iframe) bring its own data, or both. Because there will be an http request when opening the details page to obtain data such as popular posts and number of posts, you can also return the news text to the client at this time, so that the client has all the data and the page display will be faster. This is just an optimization point.
The overall process is: pushController -> hidden all views -> load page cache -> fill page data -> layout other native controls
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
I have not installed Toutiao, but the main text of almost all news apps is webview.
Take NetEase News as an example. It is a webview. After loading the news text, tell js to leave it blank and let the client fill in the following sharing, advertisements, popular posts, related news, etc. Or put a webview that displays the text on the scrollView, and put sharing, advertisements, popular posts, etc. below it.
You should know the communication method between webview and js. As for how to package webview like client-side controls, it is actually not difficult, such as getting the total height of the page, getting the thumbnail rect, customizing the menu, setting the background of the body to be transparent, and letting customers Execute certain code on the terminal, such as sharing, opening the comment interface, etc.
This is the general idea. I made something a long time ago, which is similar to the news text page, but js can control the page arbitrarily, and supports web and native controls. The boss hopes that the client can be like a web application and can change the interface at any time, add event pages, etc.
As for what you said about passing json, passing json is just how to transmit data, but what you asked about is how to implement the interface. There is no relationship between the two.
Let’s talk a little more about page caching. Webviews that are displayed frequently such as news details pages generally require page caching. You can set rules to cache html/css/js, or package them into an app, or both. Cached pages load without any stress. If you know that the main text of NetEase news is transmitted in json, then you can look through directories such as app bundle and documents/library, and there must be page cache.
Then comes the data. The cached interface is just an empty shelf, with only styles and no data. The method of filling data is very flexible and depends on your personal preferences and actual test results. You can ask ajax to request data and then fill in p, or you can ask the client to execute js to fill it in after the shelf page is loaded, or you can let the part that does not participate in caching (such as iframe) bring its own data, or both.
Because there will be an http request when opening the details page to obtain data such as popular posts and number of posts, you can also return the news text to the client at this time, so that the client has all the data and the page display will be faster. This is just an optimization point.
The overall process is:
pushController -> hidden all views -> load page cache -> fill page data -> layout other native controls
Use webview to load html, you can Baidu for details
Here is an article for you to read http://www.jianshu.com/p/1495...
Webview loads html, typesetting is the job of html