[go: up one dir, main page]

WO2016034089A1 - 图片渲染方法和装置、移动终端以及机器可读存储介质 - Google Patents

图片渲染方法和装置、移动终端以及机器可读存储介质 Download PDF

Info

Publication number
WO2016034089A1
WO2016034089A1 PCT/CN2015/088566 CN2015088566W WO2016034089A1 WO 2016034089 A1 WO2016034089 A1 WO 2016034089A1 CN 2015088566 W CN2015088566 W CN 2015088566W WO 2016034089 A1 WO2016034089 A1 WO 2016034089A1
Authority
WO
WIPO (PCT)
Prior art keywords
picture
decoding
rendering
thread
image
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Ceased
Application number
PCT/CN2015/088566
Other languages
English (en)
French (fr)
Inventor
成国凯
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
UC MOBILE CO Ltd
Original Assignee
UC MOBILE CO Ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by UC MOBILE CO Ltd filed Critical UC MOBILE CO Ltd
Publication of WO2016034089A1 publication Critical patent/WO2016034089A1/zh
Anticipated expiration legal-status Critical
Ceased legal-status Critical Current

Links

Images

Classifications

    • G—PHYSICS
    • G06—COMPUTING OR CALCULATING; COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00—Arrangements for program control, e.g. control units
    • G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
    • G06F9/44—Arrangements for executing specific programs

Definitions

  • the present invention relates to the field of mobile communication technologies, and in particular, to a picture rendering method and apparatus, a mobile terminal, and a machine readable storage medium.
  • the web page contains many web page elements, such as images, text, and videos.
  • Chrome, Android comes with a browser and third-party browsers (such as UC browser) and other browser rendering work can be done in two ways, one is done in the main thread, one is done in the rendering thread. There are two ways to do this in a similar way when rendering a web page.
  • page rendering if the image that needs to be rendered is not decoded, the image needs to be decoded first, and then the image is rendered after the decoding is completed, and then the next page element can be processed.
  • Image decoding is a time consuming task during web page rendering. Especially for web pages with multiple or large images, image decoding time-consuming is the most important factor affecting the rendering efficiency of web pages, and also the main factor affecting the overall performance of the browser. If the page image is too large or the page image is too large, the page rendering speed will be slow and the page rendering efficiency will be low.
  • the main thread or the rendering thread performs large-image rendering or multi-image webpage rendering, since the main thread or the rendering thread is performing image decoding, and cannot perform other tasks, the main thread or the rendering thread's webpage rendering efficiency is low, and even blocking occurs. There is a phenomenon of stagnation.
  • the user performs screen operations, such as screening or clicking on the control of the webpage, because the main thread or the rendering thread is performing image decoding, but cannot Other tasks are performed and the browser is also stuck.
  • an object of the present invention is to provide a picture rendering method and apparatus, a mobile terminal, and a non-transitory machine readable storage medium, which can speed up the rendering speed of webpage rendering and effectively avoid the jamming phenomenon when browsing a webpage. .
  • a picture rendering method including:
  • the picture rendering method may further include: constructing a picture decoding thread pool including one or more decoding threads;
  • the picture decoding task of the picture is created, the picture is decoded by an available decoding thread in the picture decoding thread pool.
  • the picture rendering method may further include: adding the picture decoding task to a picture decoding queue, where the decoding thread decodes the picture according to a picture decoding queue.
  • the step of the thread responsible for rendering acquiring the information of the picture may include: the thread responsible for rendering obtaining the position and size information that the picture needs to be rendered from the picture mapping table.
  • the step of rendering, by the thread responsible for rendering, the decoded picture of the decoding thread according to the acquired picture information may include: the thread responsible for rendering renders the decoding thread after decoding according to the position and size information that needs to be rendered by the picture obtained from the picture mapping table. picture of.
  • the picture rendering method may further include: when detecting that the picture is not in the preset range of the visible area, deleting the picture decoding task corresponding to the picture in the picture decoding queue and/or in the picture mapping table Delete the information of the picture.
  • the picture rendering method may further include: buffering picture decoding data of the picture that has been decoded;
  • the picture decoding data of the picture in the cache that is within the preset threshold range of the visible area is reserved.
  • a picture rendering apparatus including: a thread unit responsible for rendering, a decoding thread unit,
  • the thread unit responsible for rendering is configured to detect that the picture to be rendered is an undecoded picture when the webpage is rendered, and then create a picture decoding task of the picture for the decoding thread unit to perform the picture according to the picture decoding task of the picture. Decoding, acquiring information of the picture, and rendering the decoded picture of the decoding thread according to the acquired picture information;
  • the decoding thread unit is configured to decode the picture according to a picture decoding task of a picture.
  • the thread unit responsible for rendering may include:
  • a detecting module configured to detect, when rendering a webpage, that the image to be rendered is an undecoded image
  • a task creation module configured to create a picture decoding task of the picture
  • An information acquiring module configured to acquire information about the picture
  • a rendering module configured to render a picture that has been decoded according to the picture information acquired by the information acquiring module
  • the decoding thread unit includes:
  • the decoding module is configured to decode the picture according to the picture decoding task of the picture.
  • the thread unit responsible for rendering may further include: a thread pool building module, configured to construct a picture decoding thread pool including at least one decoding thread.
  • a thread pool building module configured to construct a picture decoding thread pool including at least one decoding thread.
  • the thread unit responsible for rendering may further include: a task management module, configured to add the picture decoding task to a picture decoding queue, where the decoding module of the decoding thread unit decodes the picture according to the picture decoding queue. .
  • a task management module configured to add the picture decoding task to a picture decoding queue, where the decoding module of the decoding thread unit decodes the picture according to the picture decoding queue.
  • the image rendering device may further include:
  • a user behavior detection module configured to detect whether a user operation behavior causes a change in a visible area of the webpage
  • Check module for checking when the user behavior detection module detects the user operation Check whether the picture in the picture decoding queue is out of the preset threshold range of the visible area;
  • a first deleting module configured to: when the checking module detects that the picture is not in the preset threshold range of the visible area, deleting the picture decoding task corresponding to the picture in the picture decoding queue and deleting the picture in the picture mapping table The location and size information of the rendering.
  • the picture rendering apparatus may further include: a buffering module, configured to buffer picture decoding data of the picture that has been decoded;
  • a second deletion module configured to: clear image decoding data of the image that has been decoded in the cache module, where the second deletion module keeps the determination in the cache module when the image decoding data in the cache module is cleared
  • the picture of the picture within the threshold range decodes the data.
  • a mobile terminal including a memory and a picture rendering device, the picture rendering device acquiring picture data from a memory for rendering a picture,
  • the picture rendering device includes a thread unit responsible for rendering, a decoding thread unit,
  • the thread unit responsible for rendering is responsive to detecting that the picture to be rendered is an undecoded picture when rendering the webpage, and creating a picture decoding task of the picture for the decoding thread unit to decode the picture according to the picture decoding task of the picture, Obtaining the information of the picture, and rendering the decoded picture of the decoding thread according to the obtained picture information;
  • the decoding thread unit decodes the picture according to a picture decoding task of the picture.
  • a non-transitory machine readable storage medium having stored thereon executable code that, when executed by a processor, causes the processor to perform the following steps :
  • a computing device the calculation The device includes a processor and a non-transitory machine readable storage medium.
  • the non-transitory machine readable storage medium stores executable code thereon.
  • the processor is caused to perform the method described above.
  • the thread responsible for rendering records the information of the picture when the undecoded picture is detected when the web page element is rendered, and then creates a picture decoding for the picture.
  • the task is for the decoding thread to decode the picture according to the picture decoding task of the picture; finally, the thread responsible for rendering renders the picture decoded by the decoding thread according to the acquired picture information.
  • the thread responsible for rendering can decode the decoding task to the decoding thread when the undecoded picture is detected, so that the thread responsible for rendering can perform the rendering of the next page element.
  • This method separates the image decoding work from the thread responsible for rendering, frees the pressure of the thread responsible for rendering, speeds up the rendering speed of the web page rendering, and effectively avoids the jamming phenomenon when browsing the webpage.
  • Figure 1 shows a flow chart of one embodiment of a picture rendering method in accordance with the present invention
  • FIG. 2 is a detailed flow chart showing another embodiment of the picture rendering method of the present invention.
  • Figure 3 is a block diagram showing the structure of a first embodiment of the picture rendering apparatus of the present invention.
  • Figure 4 is a block diagram showing the structure of the second embodiment of the picture rendering apparatus of the present invention.
  • Figure 5 is a block diagram showing the structure of a third embodiment of the picture decoding apparatus of the present invention.
  • Figure 6 is a block diagram showing the structure of a fourth embodiment of the picture decoding apparatus of the present invention.
  • FIG. 7 is a system structural diagram of an embodiment of a mobile terminal according to the present invention.
  • the thread responsible for rendering records the information of the picture when the undecoded picture is detected when the web page element is rendered, and then the picture is
  • the picture decoding task is created for the decoding thread to decode the picture according to the picture decoding task of the picture; finally, the thread responsible for rendering renders the picture decoded by the decoding thread according to the acquired picture information.
  • the thread responsible for rendering can decode the decoding task to the decoding thread when the undecoded picture is detected, and the thread responsible for rendering can perform the rendering of the next page element.
  • the work of decoding the image is separated from the thread responsible for rendering, releasing the pressure of the thread responsible for rendering, speeding up the rendering rendering speed of the webpage, and effectively avoiding the jamming phenomenon when browsing the webpage.
  • the rendering display of the webpage element is completed in the rendering thread.
  • the following embodiment of the present invention illustrates the rendering of the rendering thread by the rendering thread, that is, the thread responsible for rendering specifies the rendering thread.
  • the rendering display of the webpage elements may also be performed in the main thread, and the execution principle is similar to the rendering thread, and will not be described here.
  • Figure 1 shows a flow chart of one embodiment of a picture rendering method in accordance with the present invention.
  • step S100 the thread responsible for rendering detects that the picture to be rendered is an undecoded picture when rendering the webpage.
  • the picture decoding task of the picture is then created for the decoding thread to decode the picture according to the picture decoding task of the picture.
  • the usual browser process for displaying a webpage is generally as follows: first, the obtained webpage source code is parsed, and then the DOM tree of the webpage is generated according to the parsing result, and then the webpage is typeset according to the DOM tree of the webpage. After the typography is completed, the web page is rendered and displayed.
  • the parsing of the source code of the webpage, the typography of the webpage and the rendering of the webpage are performed asynchronously, that is, the webpage is not required to be parsed after the parsing of the source code of the entire webpage, and it is not necessary to complete the layout of all the webpage elements. Then render the webpage elements.
  • the parsing of the source code of the web page, the layout of the web page, and the rendering of the web page are performed in different threads.
  • there is also a synchronous execution situation that is, after the parsing of the source code of a webpage, the webpage elements involved in the source code are typeset, and then these elements are rendered and displayed. In this case, the source code of the webpage is parsed.
  • the layout of webpage elements, the rendering of webpage elements are all executed in the main thread.
  • step S101 the thread responsible for rendering acquires information of the picture.
  • the image information herein includes the position and size information of the image to be rendered recorded in the image mapping table.
  • the location and size information here is determined when the picture element is typeset.
  • step S102 the thread responsible for rendering renders the decoded picture of the decoding thread according to the acquired picture information.
  • the rendering thread renders the decoded picture of the decoding thread according to the obtained position and size information of the picture to be rendered.
  • Fig. 2 shows a detailed flow chart of another embodiment of the picture rendering method of the present invention.
  • step S200 the rendering thread detects that the picture to be rendered is an undecoded picture when rendering the webpage.
  • the web page contains many web page elements, including images, text, and videos.
  • the rendering thread When the browser renders the webpage, the rendering thread renders the webpage elements one by one according to the structure of the layout tree of each webpage in the rendering process.
  • the information of each webpage element is recorded in a locally cached file.
  • the rendering thread goes to the corresponding file to obtain the information of the current element to perform rendering of the webpage element.
  • the browser parses the source code of the webpage, it parses the address of the image resource server that obtains the image, and the browser obtains the image data from the resource server according to the address, and then stores the image data in the local cache.
  • the image data obtained by the image resource server cannot be directly rendered by the rendering thread without being decoded. Because the display must be decoded before rendering, the rendering thread must first detect the type of the page element before rendering the page element. If it is a picture, it is necessary to detect whether the picture is an undecoded picture.
  • S210 After detecting that the picture needs to be decoded, executing S210, creating a picture decoding task of the picture. After the picture decoding task is created, the picture decoding task is added to the picture decoding queue (S220). Then, S230 may be performed to determine whether the picture decoding thread pool has been constructed.
  • the thread in the picture decoding thread pool is used to perform the picture decoding task.
  • the wake-up decoding thread will be notified immediately to decode the picture.
  • all the threads in the thread pool are in the suspended state. In the actual implementation, only one thread is generated in the picture decoding thread pool, but when the picture decoding task is many, the image decoding thread can be quickly expanded to join the thread pool.
  • the picture decoding task queue selects a picture decoding task to be added to the decoding thread pool (S240).
  • steps S230 and S231 may not be performed here.
  • the decoding thread is notified to decode the picture (S260).
  • the decoding thread pool wakes up the available decoding threads first, and then the pictures are decoded by the available decoding threads.
  • steps S250 and S251 may not be performed here.
  • the rendering thread continues the rendering of the next webpage element, and the rendering action of the image is not performed yet.
  • the decoding thread After the decoding is completed, the decoding thread notifies the rendering thread to perform rendering of the picture (S270).
  • the rendering thread Before the rendering of the image, the rendering thread first executes S280 to acquire information of the image.
  • the picture information here includes location and size information that the picture needs to be rendered. This step is actually the location and size information that the rendering thread needs to render from the image mapping table.
  • the location and size information that the image needs to be rendered is calculated when the webpage is typeset.
  • the thread responsible for the webpage layout parses the image to obtain the image size, and then calculates the image to be rendered according to the webpage layout needs.
  • the position displayed and the size that needs to be rendered needs to be rendered.
  • the size of the parsed image is not necessarily the same as the size of the rendered image, because the browser will combine many factors, such as the size of the display, the size of the web page, and other factors to scale the image. Therefore, the size of the image obtained from the resource server is 100*100 pixels, and the size of the rendered display needs to be 50*50 after the typographic calculation.
  • the thread responsible for the layout completes the preliminary analysis of the image, and then calculates the position of the image to be rendered and the size of the image to be rendered according to the layout of the webpage.
  • the position where the image is to be rendered and the size information to be rendered are transmitted to the rendering thread, and the rendering thread records the information in the image mapping table after receiving the information of the image.
  • the key value of the picture map is the picture object pointer, and the value is the superimposed value of all the rectangular areas that have appeared in the web page of the picture to be drawn.
  • the location of the image recorded in the image map to be rendered in the web page includes the historical location and the most recent location, ie all locations where the image may exist in the webpage. Since most of the current webpages are dynamic webpages, many of the images in the webpage are constantly changing in position, shape, and the like. Therefore, in different time periods, the position of the picture in the web page is likely to be different.
  • the position of the image rendering display recorded in the image mapping table is the position where the image is superimposed and recorded every time the webpage is rendered. At the same time, since there may be multiple identical pictures in the same web page, and the original data of the picture is actually only one copy, only one picture needs to be decoded, but after the decoding is completed, the picture may need to be rendered in multiple areas of the page. Therefore, in this embodiment, all positions where the recorded picture has appeared are superimposed in the picture mapping table, that is, the historical position and the latest position are included.
  • S290 is executed, and the image that has been decoded is rendered according to the position and size information that the image needs to be rendered.
  • the thread responsible for rendering when the thread responsible for rendering detects an undecoded picture when rendering a webpage element, the information of the picture is recorded, and then a picture decoding task is created for the picture for the decoding thread to decode the picture according to the picture. Decoding the picture; finally, the thread responsible for rendering renders the picture decoded by the decoding thread according to the acquired picture information. Since the present invention uses a separate decoding thread for picture decoding, the thread responsible for rendering can decode the decoding task to the decoding thread when the undecoded picture is detected, and the thread responsible for rendering can perform the rendering of the next page element. . Separating the image decoding work from the thread responsible for rendering, releasing the pressure of the thread responsible for rendering, speeding up the rendering speed of the web page rendering, can have Effectively avoids the stuttering that occurs when browsing the web.
  • the picture decoding process when a user operation is detected, such as a user scrolling a web page, or opening a new web page, etc. This may cause the viewable area of the web page to change. For this reason, in the preferred embodiment, when the visible area of the webpage changes, it is detected whether the picture in the picture decoding task is out of the preset threshold range of the visible area, and if so, the picture decoding task corresponding to the picture is performed. And the picture information recorded in the corresponding picture mapping table is deleted. After the processing of the above steps, the picture currently being decoded can be guaranteed, and the picture in the visible area, rather than the visible area, will not be wasted by the CPU to decode it.
  • the browser caches the picture decoding data of the picture that has been decoded.
  • the image decoding data buffer is performed to minimize the picture decoding time.
  • the image data after decoding is completed in the cache and the cache is cleared when the cache threshold is exceeded.
  • the image buffer pool space is not enough. Therefore, the browser will continuously clean up the image cache, and the decoding thread will continue to decode the image. This will cause the picture decoding data to exist in the previous instant, and the picture can be drawn, and then the picture decoded data is cleared because the buffer is full.
  • this embodiment will decode the picture using another decoding thread. Before the decoding is completed, the picture will not be rendered, so the user will not see the picture in the process. After the picture is decoded, the picture is rendered and displayed, which will cause the picture to appear blinking.
  • the picture decoding data of the picture in the cache that is determined to be within the preset threshold range of the visible area is retained. That is to say, before the picture decoding data in the cache is cleared, it is also detected whether the picture to be deleted exists in the visible preset threshold area, and if so, the picture decoding data of the picture is not available regardless of whether the cache is full or not. Deleted in the cache. This effectively avoids the problem of page flickering when web browsing is performed.
  • the visible area preset threshold range in the preferred embodiment may be the same as the visible area preset threshold range described in the previous embodiment. That can be the current screen
  • the range of the area being displayed by the screen may also be a preset threshold area range outside the currently displayed range, for example, a screen range of the current page or a multi-screen page range.
  • Fig. 3 is a block diagram showing the structure of a first embodiment of the picture rendering apparatus of the present invention.
  • the picture decoding apparatus of this embodiment includes: a thread unit 10 responsible for rendering, and a decoding thread unit 20.
  • the thread unit 10 responsible for rendering detects that the picture to be rendered is an undecoded picture when the web page is rendered, and creates a picture decoding task of the picture for the decoding thread unit 20 to perform the picture according to the picture decoding task of the picture. Decoding, acquiring information of the picture, and rendering the decoded picture of the decoding thread according to the acquired picture information.
  • the decoding thread unit 20 decodes the picture according to a picture decoding task of the picture.
  • Fig. 4 is a block diagram showing the structure of a second embodiment of the picture rendering apparatus of the present invention.
  • the thread unit 10 responsible for rendering of the picture rendering apparatus of this embodiment includes: a detection module 400, a task creation module 401, a task management module 402, a first determination module 403, a task selection module 404, and a thread.
  • the decoding thread unit 20 includes a decoding module 407.
  • the detecting module 400 is configured to detect that the picture to be rendered is an undecoded picture when the rendering thread renders the webpage.
  • the rendering thread renders the webpage elements one by one according to the structure of the layout tree during the rendering process.
  • the information of each element may be recorded in a locally cached file.
  • the rendering thread goes to the corresponding file to obtain the information of the current element to perform rendering of the webpage element.
  • the picture data of the picture is obtained by the browser according to the address corresponding to the picture parsed by the source code of the webpage, and is stored in the local cache after being acquired by the image resource server.
  • the rendering thread obtained from the image resource server cannot render the rendering directly without decoding.
  • the decoding process must be performed before the rendering display is performed, so the rendering thread first detects the type of the webpage element by the detecting module 400 before rendering the webpage element. If it is a picture, it is necessary to detect whether the picture is an undecoded picture.
  • the task creation module 401 creates a picture decoding task of the picture.
  • the task management module 402 adds the picture decoding task to the picture decoding queue.
  • the first judging module 403 may be set to determine whether the picture decoding thread pool has been constructed.
  • task selection module 404 selects a picture decoding task from the picture decoding task queue to join the decoding thread pool.
  • the thread pool construction module 405 constructs a picture decode thread pool containing one or more decode threads.
  • the first judging module 403 and the thread pool creating module 405 may not be provided in the thread unit 10 responsible for rendering.
  • the second determining module 406 determines whether there is a decoding thread available in the decoding thread pool.
  • the decoding module 407 decodes the picture.
  • the decoding thread pool needs to wake up the available decoding thread first, and then decode the picture by the decoding module 407 of the available decoding thread.
  • the decoding thread creation module 408 creates a decoding thread or waits for the decoding thread to complete the decoding task, and then the decoding module 407 decodes the picture.
  • the second judging module 406 and the decoding thread creating module 408 may not be provided in the thread unit 10 responsible for rendering.
  • the rendering module 411 continues the rendering operation of the next webpage element, and does not perform the rendering action of the image.
  • the communication module 409 After the decoding is completed, the communication module 409 notifies the rendering thread to perform rendering of the picture.
  • the information of the picture is acquired by the information acquisition module 410 before the picture is rendered.
  • the picture information here includes location and size information that the picture needs to be rendered.
  • the information obtaining module 410 actually obtains the position and size information that the picture needs to be rendered from the picture mapping table.
  • the location and size information that the image needs to be rendered is calculated when the webpage is typeset.
  • the thread responsible for the webpage layout parses the image to obtain the image size, and then calculates the image to be rendered according to the webpage layout needs.
  • the position displayed and the size that needs to be rendered It should be noted that the size of the parsed image is not necessarily the same as the size of the rendered image, because the browser will combine many factors, such as the size of the display, the size of the web page, and other factors to scale the image. Therefore, the size of the image obtained from the resource server is 100*100 pixels, and the size of the rendered display needs to be 50*50 after the typographic calculation.
  • the thread responsible for the layout completes the preliminary analysis of the image, and then calculates the position to be rendered and the size of the image to be rendered according to the layout of the webpage, and then transfers the position of the image to be rendered and the size information to be rendered to the rendering thread.
  • the rendering thread receives the information of the image, it records the information in the image mapping table.
  • the key value of the picture map is the picture object pointer, and the value is the superimposed value of all the rectangular areas that have appeared in the web page of the picture to be drawn.
  • the position of the image recorded in this image map in the web page to be rendered and displayed includes the historical location and the latest location, that is, all the locations where the image may exist in the webpage. Since most of the current web pages are dynamic web pages, the images are likely to be constantly changing in position, shape, and the like. Therefore, in different time periods, the position of the picture in the web page is likely to be different.
  • the position of the image rendering display recorded in the image mapping table is the position where the image is superimposed and recorded every time the webpage is rendered. At the same time, since there may be multiple identical pictures in the same web page, and the original data of the picture is actually only one copy, only one picture needs to be decoded, but after the decoding is completed, the picture may need to be rendered in multiple areas of the page. Therefore, this embodiment requires a picture mapping table. Superimposes all the positions where the picture has appeared, including the historical position and the latest position.
  • the rendering module 411 of the rendering thread renders the image that has been decoded according to the position and size information that needs to be rendered. Rendering.
  • a picture decoding task is created for the picture for the decoding thread unit to decode the picture according to the picture decoding task of the picture.
  • the thread unit responsible for rendering acquires the information of the picture, and finally renders the picture decoded by the decoding thread unit according to the recorded picture information.
  • the decoding work is separated from the thread unit responsible for rendering, and the decoding thread performs decoding of the picture.
  • the rendering thread or the main thread responsible for rendering can perform the next task, separate the work of decoding the image, release the pressure of the main thread or the rendering thread, and speed up the rendering rendering speed of the webpage. Effectively avoid the stuttering phenomenon when browsing the web.
  • Fig. 5 is a block diagram showing the structure of a third embodiment of the picture decoding apparatus of the present invention.
  • the user behavior detecting module 500, the checking module 501, and the first deleting module 502 are included in the picture decoding process.
  • the user behavior detection module 500 is configured to detect whether the user operation behavior causes a change in the visible area of the webpage.
  • the user operation behavior here includes operations such as the user scrolling the webpage or opening a new webpage. Because the visible area of the webpage will be constantly changing.
  • the checking module 501 checks whether the picture in the picture decoding queue is out of the preset threshold range of the visible area. If yes, the first deletion module 502 deletes the picture decoding task corresponding to the picture in the picture decoding queue and the position and size information that needs to be rendered in the picture mapping table to delete the picture. After the processing of the above steps, the picture currently being decoded can be guaranteed to be visible. Images within the region, not the visible region, will not be wasted CPU time to decode them.
  • Fig. 6 is a block diagram showing the configuration of a fourth embodiment of the picture decoding apparatus of the present invention.
  • the picture rendering apparatus of the present invention includes, in addition to the module of the embodiment shown in FIG. 4, a cache module 600, a second deletion module 601, and Visual range detection module 602.
  • the buffer module 600 buffers the picture decoding data of the picture that has been decoded.
  • the image decoding data buffer is performed to minimize the picture decoding time.
  • the second deletion module 601 clears the picture decoding data of the picture that has been decoded in the buffer module 600.
  • the second deletion module 601 continuously clears the picture cache, and at the same time, the decoding module 407 continuously decodes the picture. This will cause the picture decoding data to exist in the previous instant, and the picture can be drawn, and then the picture decoded data is cleared because the buffer is full.
  • the present embodiment decodes the picture using the decoding module 407 of another thread.
  • the rendering module 411 Before the decoding is completed, the rendering module 411 will not render the image, so the user will not see the image in the process. After the image decoding is completed, the image is rendered and displayed by the rendering module 411, which will cause the page to appear continuously. Flashing problem.
  • the second deletion module 601 when the second deletion module 601 performs picture decoding data cache cleaning, the picture decoding data of the picture in the cache that is within the preset threshold range of the visible area is not cleared. That is to say, before the picture decoding data in the cache is cleared, the visible range detecting module 602 also detects whether the picture to be deleted exists in the visible preset threshold area, and if so, whether the picture is full or not, the picture is The picture decoding data is not deleted from the cache. This effectively avoids the problem of flashing pictures on the page.
  • the visible area preset threshold range in the preferred embodiment may be the same as the visible area preset threshold range described in the previous embodiment. That is, it can be the range of the area where the current screen is being displayed, or it can be the preset outside the currently displayed range.
  • the threshold area range for example, may be a one-page page range after the current page, or a multi-screen page range.
  • FIG. 7 is a system structural diagram of an embodiment of a mobile terminal according to the present invention.
  • the mobile terminal of the present invention includes a browser engine, a rendering engine, a network, a JS interpreter, and a memory.
  • the user interface includes an address bar, a back/forward button, a bookmark directory, and the like, that is, other parts that the user sees in addition to the main window for displaying the page requested by the user.
  • the browser engine is used to query and manipulate the interface of the rendering engine.
  • the rendering engine is used to display the content of the webpage requested by the user. For example, if the requested content is html, it is responsible for parsing the html and css, and displaying the parsed result. That is responsible for web page parsing, typesetting, rendering and rendering web content to the screen.
  • the network is used to complete the network call. For example, if the webpage parsed by the rendering engine has an http request, the web server is requested to obtain the corresponding webpage resource, such as a picture or a video, according to the http request. It is then rendered for rendering by the rendering engine.
  • the network has a platform-independent interface that works on different platforms.
  • the JS interpreter is used to interpret the execution JS code.
  • the JS code is the rendering engine that parses the web page and finds that there is JS code, and then the JS interpreter executes the JS code.
  • the memory includes permanent memory and a cache.
  • the mobile terminal's browser needs to store various data like cookies on the hard disk.
  • HTML5 defines web database technology and is a lightweight and complete client storage technology.
  • the image rendering device of the rendering engine takes image data from the memory for rendering the image.
  • the rendering engine comprises a picture rendering device.
  • the picture rendering device includes a thread unit 10 and a decoding thread unit 20 responsible for rendering.
  • the thread unit 10 responsible for rendering detects that the picture to be rendered is an undecoded picture when the web page is rendered, and then creates a picture decoding task of the picture for the decoding thread unit 20 to decode the picture according to the picture decoding task of the picture;
  • the thread unit 10 responsible for rendering acquires the information of the picture.
  • the thread unit 10 responsible for rendering renders and decodes according to the acquired picture information.
  • the decoded picture by the thread unit 20 is the decoded picture by the thread unit 20.
  • FIG. 7 is merely an architectural diagram of a mobile terminal including the picture rendering apparatus of the present invention, and there are many variants of the architecture, or modules including other similar functions. As long as the picture rendering apparatus of the present invention including the present invention is considered to be a modification of the mobile terminal protected by the present invention.
  • modules and algorithm steps of the various examples described in connection with the embodiments disclosed herein can be implemented in electronic hardware or a combination of computer software and electronic hardware. Whether these functions are performed in hardware or software depends on the specific application and design constraints of the solution. A person skilled in the art can use different methods for implementing the described functions for each particular application, but such implementation should not be considered to be beyond the scope of the present invention.
  • the disclosed systems, devices, and methods may be implemented in other manners.
  • the device embodiments described above are merely illustrative.
  • the division of the modules is only a logical function division.
  • there may be another division manner for example, multiple modules or components may be combined or Can be integrated into another system, or some features can be ignored or not executed.
  • the mutual coupling or direct coupling or communication connection shown or discussed may be an indirect coupling or communication connection through some interface, device or module, and may be electrical, mechanical or otherwise.
  • the modules described as separate components may or may not be physically separated.
  • the components displayed as modules may or may not be physical modules, that is, may be located in one place, or may be distributed to multiple network modules. Some or all of the modules may be selected according to actual needs to achieve the purpose of the solution of the embodiment.
  • each functional module in each embodiment of the present invention may be integrated into one processing module, or each module may exist physically separately, or may be two or two. More than one module is integrated in one module.
  • the functions, if implemented in the form of software functional modules and sold or used as separate products, may be stored in a machine readable storage medium.
  • the technical solution of the present invention which is essential or contributes to the prior art, or a part of the technical solution, may be embodied in the form of a software product, which is stored in a storage medium, including
  • the instructions are used to cause a computing device (which may be a personal computer, a server, a mobile terminal such as a cell phone, or a network device, etc.) or a processor to perform all or part of the steps of the methods described in various embodiments of the present invention.
  • the foregoing storage medium includes: a U disk, a mobile hard disk, a read-only memory (ROM), a random access memory (RAM), a magnetic disk, or an optical disk, and the like. .
  • the above technical concept of the present invention can be embodied as a non-transitory machine readable storage medium having executable code stored thereon.
  • the processor When the executable code is executed by the processor, the processor is caused to perform the method described above.
  • the above technical concept of the present invention can also be embodied as a computing device including a processor and a non-transitory machine readable storage medium.
  • the non-transitory machine readable storage medium stores executable code thereon.
  • the processor is caused to perform the method described above.

Landscapes

  • Engineering & Computer Science (AREA)
  • Software Systems (AREA)
  • Theoretical Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • General Engineering & Computer Science (AREA)
  • General Physics & Mathematics (AREA)
  • Information Transfer Between Computers (AREA)

Abstract

一种图片渲染方法和装置、移动终端以及机器可读存储介质。该方法中，负责渲染的线程在渲染网页时检测出准备渲染的图片为未解码图片，创建所述图片的图片解码任务以供解码线程根据图片的图片解码任务对所述图片进行解码（S100）；获取所述图片的信息（S101）；根据获取的图片信息渲染所述解码线程解码后的图片（S102）。由于该方法使用单独解码线程进行图片解码，使得负责渲染的线程能够在检测到未解码的图片时将解码任务交由解码线程进行解码，而负责渲染的线程则可以进行下一网页元素的渲染工作，因此将图片解码的工作从负责渲染的线程中分离出来，释放了负责渲染的线程的压力，加快了网页渲染的渲染速度，能有效避免浏览网页时产生的卡顿现象。

Description

图片渲染方法和装置、移动终端以及机器可读存储介质 技术领域
本发明涉及移动通信技术领域，更为具体地，涉及图片渲染方法和装置、移动终端以及机器可读存储介质。
背景技术
网页页面中包含很多网页元素，例如图片，文字还有视频等。目前Chrome、android自带浏览器及第三方浏览器(如UC浏览器)等浏览器的渲染工作有两种执行方式，一种是在主线程完成，一种是在渲染线程完成。两种方式在网页渲染时执行方式类似。在页面渲染的过程中，如发现需要渲染的图片未进行图片解码，则首先需对该图片进行解码，解码完成后再对图片进行渲染，之后才能进行下一网页元素的处理。
在网页渲染过程中图片解码是一个很耗时的工作。特别对于拥有多图或者大图的网页来说，图片解码耗时是影响网页渲染效率最主要的因素，也是影响浏览器整体性能的主要因素。如果网页图片过大或者网页图片很多都会导致网页渲染速度慢，网页渲染效率低。在主线程或者渲染线程进行大图片渲染或者多图片网页的渲染时，由于主线程或者渲染线程正在进行图片解码，而不能执行其它任务，导致主线程或者渲染线程的网页渲染效率低，甚至出现堵塞出现卡顿现象。
同时如果在渲染线程或者主线程网页渲染过程中正在进行图片的解码，此时用户进行屏幕操作，比如划屏或者点击网页的控件等，由于此时主线程或者渲染线程正在进行图片解码，而不能执行其它任务，浏览器也出现卡顿现象。
所以，现有方法中，浏览器的渲染线程或者主线程在进行网页的大图渲染或者多图渲染时，由于在进行图片的解码，而不能 进行其它工作会导致浏览器出现渲染速度慢，效率低，甚至出现阻塞卡顿或者会导致用户划屏卡顿。
发明内容
鉴于上述技术问题，本发明的目的是提供一种图片渲染方法和装置、移动终端以及非暂时性机器可读存储介质，其能加快网页渲染的渲染速度，有效避免浏览网页时产生的卡顿现象。
根据本发明的一个方面，提供了一种图片渲染方法，包括：
响应于负责渲染的线程在渲染网页时检测出准备渲染的图片为未解码图片，创建所述图片的图片解码任务以供解码线程根据图片的图片解码任务对所述图片进行解码；
获取所述图片的信息；
根据获取的图片信息渲染所述解码线程解码后的图片。
优选地，该图片渲染方法还可以包括：构建包含一个或多个解码线程的图片解码线程池；
所述图片的图片解码任务创建完成后，由图片解码线程池中一个可用解码线程对所述图片进行解码。
优选地，该图片渲染方法还可以包括：将所述图片解码任务加入图片解码队列，所述解码线程根据图片解码队列对所述图片进行解码。优选地，负责渲染的线程获取所述图片的信息的步骤可以包括：负责渲染的线程从图片映射表中获取所述图片需要渲染的位置及大小信息。负责渲染的线程根据获取的图片信息渲染解码线程解码后的图片的步骤可以包括：负责渲染的线程根据从图片映射表中获取的所述图片需要渲染的位置及大小信息渲染所述解码线程解码后的图片。
优选地，该图片渲染方法还可以包括：当检测到图片不在可视区域的预设范围内时，则在图片解码队列中删除所述图片对应的图片解码任务和/或在所述图片映射表删除所述图片的信息。
优选地，该图片渲染方法还可以包括：对已经完成解码的图片的图片解码数据进行缓存；
在进行图片解码数据缓存清理时，保留缓存中的确定处于可视区域预设阈值范围内的图片的图片解码数据。
根据本发明的另一方面，还提供了一种图片渲染装置，包括：负责渲染的线程单元、解码线程单元，
所述负责渲染的线程单元，用于在渲染网页时检测出准备渲染的图片为未解码图片，则创建所述图片的图片解码任务以供解码线程单元根据图片的图片解码任务对所述图片进行解码，获取所述图片的信息，根据获取的图片信息渲染解码线程解码后的图片；
所述解码线程单元，用于根据图片的图片解码任务对所述图片进行解码。
优选地，所述负责渲染的线程单元可以包括：
检测模块，用于在渲染网页时检测出准备渲染的图片为未解码图片；
任务创建模块，用于创建所述图片的图片解码任务；
信息获取模块，用于获取所述图片的信息；
渲染模块，用于根据信息获取模块获取的图片信息渲染已经完成解码的图片；
其中，所述解码线程单元包括：
解码模块，用于根据图片的图片解码任务对图片进行解码。
优选地，所述负责渲染的线程单元还可以包括：线程池构建模块，所述线程池构建模块用于构建包括至少一个解码线程的图片解码线程池。
优选地，所述负责渲染的线程单元还可以包括：任务管理模块，用于将所述图片解码任务加入图片解码队列以供所述解码线程单元的解码模块根据图片解码队列对所述图片进行解码。
优选地，该图片渲染装置还可以包括：
用户行为检测模块，用于检测用户操作行为是否导致了网页可视区域发生变化；
检查模块，用于在用户行为检测模块检测到用户操作时，检 查图片解码队列中的图片是否已不在可视区域预设阈值范围内；
第一删除模块，用于检查模块检查出图片不在所述可视区域预设阈值范围内时，在图片解码队列中删除所述图片对应的图片解码任务和在图片映射表中删除所述图片需要渲染的位置及大小信息。
优选地，该图片渲染装置还可以包括：缓存模块，用于缓存已经完成解码的图片的图片解码数据；
第二删除模块，用于清理缓存模块中的已经完成解码的图片的图片解码数据，其中第二删除模块在清理缓存模块中的图片解码数据时，保留缓存模块中的确定处于可视区域预设阈值范围内的图片的图片解码数据。
根据本发明的另一个方面，还提供了一种移动终端，包括存储器、图片渲染装置，所述图片渲染装置从存储器中获取图片数据以进行图片渲染，
所述图片渲染装置包括负责渲染的线程单元、解码线程单元，
所述负责渲染的线程单元响应于在渲染网页时检测出准备渲染的图片为未解码图片，创建所述图片的图片解码任务以供解码线程单元根据图片的图片解码任务对所述图片进行解码，获取所述图片的信息，根据获取的图片信息渲染解码线程解码后的图片；
所述解码线程单元根据图片的图片解码任务对所述图片进行解码。
根据本发明的另一个方面，还提供了一种非暂时性机器可读存储介质，其上存储有可执行代码，当所述可执行代码被处理器执行时，使所述处理器执行以下步骤：
响应于负责渲染的线程在渲染网页时检测出准备渲染的图片为未解码图片，创建所述图片的图片解码任务以供解码线程根据图片的图片解码任务对所述图片进行解码；
获取所述图片的信息；
根据获取的图片信息渲染所述解码线程解码后的图片。
根据本发明的另一个方面，还提供了一种计算设备，该计算 设备包括处理器和非暂时性机器可读存储介质。该非暂时性机器可读存储介质上存储有可执行代码。当该可执行代码被该处理器执行时，使该处理器执行上文所述的方法。
根据本发明的图片渲染方法和装置、移动终端以及机器可读存储介质，负责渲染的线程在渲染网页元素时检测到未解码图片时，记录所述图片的信息，然后为所述图片创建图片解码任务以供解码线程根据图片的图片解码任务对所述图片进行解码；最后负责渲染的线程根据获取的图片信息渲染解码线程解码的图片。
由于本发明使用单独解码线程进行图片解码，使得负责渲染的线程能够在检测到未解码的图片时将解码任务交由解码线程进行解码，从而负责渲染的线程则可以进行下一网页元素的渲染工作。该方法将图片解码的工作从负责渲染的线程中分离出来，释放了负责渲染的线程的压力，加快了网页渲染的渲染速度，能有效避免浏览网页时产生的卡顿现象。
为了实现上述以及相关目的，本发明的一个或多个方面包括后面将详细说明并在权利要求中特别指出的特征。下面的说明以及附图详细说明了本发明的某些示例性方面。然而，这些方面指示的仅仅是可使用本发明的原理的各种方式中的一些方式。此外，本发明旨在包括所有这些方面以及它们的等同物。
附图说明
通过参考以下结合附图的说明及权利要求书的内容，并且随着对本发明的更全面理解，本发明的其它目的及结果将更加明白及易于理解。在附图中：
图1示出了根据本发明图片渲染方法的一个实施例的流程图；
图2示出了本发明的图片渲染方法另一个实施例的详细流程图；
图3示出了本发明的图片渲染装置的第一个实施例的结构框图；
图4示出了本发明的图片渲染装置的第二个实施例的结构框 图；
图5示出了本发明的图片解码装置的第三个实施例的结构框图；
图6示出了本发明的图片解码装置的第四个实施例的结构框图；
图7为本发明的移动终端一个实施例的系统结构图。
在所有附图中相同的标号指示相似或相应的特征或功能。
具体实施方式
以下将结合附图对本发明的具体实施例进行详细描述。
根据本发明的图片渲染方法和装置、移动终端以及非暂时性机器可读存储介质，负责渲染的线程在渲染网页元素时检测到未解码图片时，记录所述图片的信息，然后为所述图片创建图片解码任务以供解码线程根据图片的图片解码任务对所述图片进行解码；最后负责渲染的线程根据获取的图片信息渲染解码线程解码的图片。
由于本发明使用单独解码线程进行图片解码，使得负责渲染的线程能够在检测到未解码的图片时将解码任务交由解码线程进行解码，而负责渲染的线程则可以进行下一网页元素的渲染工作。将图片解码的工作从负责渲染的线程中分离出来，释放了负责渲染的线程的压力，加快了网页渲染渲染速度，能有效避免浏览网页时产生的卡顿现象。
通常情况下，在网页元素的渲染显示是在渲染线程完成的，本发明的下面的实施例以渲染线程执行渲染显示为例进行说明，即负责渲染的线程为渲染线程进行具体说明。本领域技术人员应该理解，在网页元素的渲染显示也可能是在主线程执行，执行原理与渲染线程类似，这里不赘述。
图1示出了根据本发明图片渲染方法的一个实施例的流程图。
如图1所示，在本实施例的图片渲染方法中，在步骤S100,负责渲染的线程在渲染网页时检测出准备渲染的图片为未解码图片， 则创建所述图片的图片解码任务以供解码线程根据图片的图片解码任务对所述图片进行解码。
目前通常的浏览器在进行网页的显示过程通常流程如下：首先会对获取的网页源代码进行解析，然后根据解析结果生成网页的DOM树，之后根据网页的DOM树对网页进行排版。完成排版之后，对网页进行渲染显示。
目前网页源代码的解析，网页的排版和网页的渲染是异步执行进行的，即并不要求完成整个网页的源代码的解析之后再进行网页的排版，并不是必须完成所有的网页元素的排版之后再进行网页元素的渲染。对网页源代码的解析，网页的排版，以及网页的渲染是在不同的线程中执行。当然现在也有同步执行的情况，即完成一段网页源代码的解析，就对这段源代码中涉及的网页元素进行网页的排版，之后对这些元素进行渲染显示，这种情况下网页源代码的解析，网页元素的排版，网页元素的渲染显示都在主线程中执行。
所以可以看出一个网页元素要渲染之前所述网页元素的排版工作已经完成。
渲染线程在渲染网页的网页元素时，当准备渲染的网页元素为图片时，首先需要检测这个图片是否已经解码，如果没有解码，则需要先进行图片解码。解码完成之后才能进行图片类网页元素的渲染。
在步骤S101,负责渲染的线程获取所述图片的信息。
负责渲染的线程如果为渲染线程，即渲染线程获取渲染图片时需要的图片信息，这里的图片信息包括记录在图片映射表中的所述图片需要渲染的位置及大小信息。这里的位置及大小信息是在进行图片元素排版时确定的。
在步骤S102,负责渲染的线程根据获取的图片信息渲染解码线程解码后的图片。
渲染线程根据获取的所述图片需要渲染的位置及大小信息渲染解码线程解码后的图片。
图2示出了本发明的图片渲染方法另一个实施例的详细流程图。
如图2所示，在本实施例的图片渲染方法中，在步骤S200,渲染线程在渲染网页时检测到准备渲染的图片为未解码图片。
网页中包含很多网页元素，包括图片，文字还有视频等。在浏览器进行网页渲染时，渲染线程在渲染过程中是根据每个网页的排版树的结构逐个对网页元素进行渲染。每个网页元素的信息记录在本地缓存的文件中，当执行渲染时，即渲染线程去相应的文件中获取当前元素的信息执行网页元素的渲染。
浏览器解析网页源代码时会解析出获取图片的图片资源服务器地址，浏览器根据该地址向资源服务器获取图片数据，获取后存储于本地缓存中。图片资源服务器获取的图片数据在没有经过解码的情况下，渲染线程不能够直接渲染显示。因为必须先经过解码处理才能进行渲染显示，所以渲染线程在进行网页元素渲染前，首先要检测出网页元素的类型。如果是图片，就要检测图片是否是未解码图片。
在检测到图片需要解码之后，执行S210，创建所述图片的图片解码任务。创建完图片解码任务后，将所述图片解码任务加入图片解码队列中(S220)。之后可以执行S230，判断图片解码线程池是否已经构建。
图片解码线程池中的线程用于执行图片解码任务，图片解码任务创建完成的同时，将立即通知唤醒解码线程进行图片解码，在没有图片解码任务时，线程池中的所有线程处于挂起状态。在实际实现中，图片解码线程池中仅生成了一个线程，但在图片解码任务很多的时候可以快速扩展出更多的图片解码线程加入到线程池中。
如果图片解码线程池已经构建，则图片解码任务队列选择一个图片解码任务加入解码线程池中(S240)。
如果解码线程池还没构建，则构建包含一个或多个解码线程的图片解码线程池(S231)。
本领域技术人员应当理解，由于可以预先完成解码线程池的创建工作，因此，在此也可以不执行步骤S230和S231。
完成S240或者S231后，进一步判断解码线程池中是否有可用的解码线程(S250)。
如果有可用的解码线程，则通知解码线程对图片进行解码(S260)。这里解码线程池先唤醒可用的解码线程，然后由可用的解码线程对图片进行解码。
如果没有可用的解码线程，则执行S251,创建解码线程或者等待解码线程完成解码任务,然后进入S260。
本领域技术人员应当理解，由于可以预先创建足够多的解码线程，因此，这里也可以不执行步骤S250和S251。
在解码完成之前，渲染线程继续进行下一网页元素的渲染工作，暂不执行该图片的绘制动作。
解码完成后，解码线程通知渲染线程进行该图片的渲染(S270)。
在进行该图片渲染前，渲染线程先执行S280,获取所述图片的信息。
这里的图片信息包括所述图片需要渲染的位置及大小信息。这个步骤其实是渲染线程从图片映射表中获取所述图片需要渲染的位置及大小信息。
所述图片需要渲染的位置及大小信息是在进行网页排版时计算出来的，在进行网页排版时，负责网页排版的线程对图片进行初步解析得到图片大小，然后根据网页排版需要计算出图片要渲染显示的位置和需要渲染显示的大小。本步骤中需要注意，解析出来的图片大小与图片渲染显示的大小并不一定相同，因为浏览器会综合很多方面的因素，比如显示屏的大小、网页缩放等因素对图片进行缩放。所以从资源服务器获取的图片的大小为100*100像素，最后经过排版计算后需要渲染显示的大小为50*50。
负责排版的线程完成对图片进行初步解析，然后根据网页排版需要计算出图片要渲染显示的位置和需要渲染显示的大小后， 将图片要渲染显示的位置和需要渲染显示的大小信息传输给渲染线程，渲染线程收到图片的这些信息后就将这些信息记录在图片映射表中。
图片映射表的key值为图片对象指针，value值为需要绘制的图片的在网页中出现过的所有矩形区域的叠加值。
图片映射表中记录的图片在网页中要渲染显示的位置包括历史位置和最新的位置，即图片在网页中可能存在的所有位置。由于目前大多数网页为动态网页，网页中很多图片是不断发生位置、形状等变化。因此，在不同时间段中，图片在网页中所处的位置很可能也不一样。在图片映射表中记录的图片渲染显示的位置是叠加记录每一次网页渲染显示时图片的所在位置。同时由于同一个网页中可能出现多个完全一样的图片，而图片原始数据其实只有一份，所以仅需对一张图片进行解码，但解码完成后，图片可能需要渲染在页面的多个区域。所以本实施例需要在图片映射表中叠加记录图片出现过的所有位置，即包括历史位置和最新的位置。
在完成图片的解码，又获取到了图片需要渲染的位置和大小信息后，执行S290,根据获取图片需要渲染的位置和大小信息对已经完成解码的图片进行渲染。
本领域技术人员应该知道上述步骤中的S280的顺序可以改变，可以在S200之后，S290之前的任意步骤执行。
本实施例的图片渲染方法，负责渲染的线程在渲染网页元素时检测到未解码图片时，记录所述图片的信息，然后为所述图片创建图片解码任务以供解码线程根据图片的图片解码任务对所述图片进行解码；最后负责渲染的线程根据获取的图片信息渲染解码线程解码的图片。由于本发明使用单独解码线程进行图片解码，使得负责渲染的线程能够在检测到未解码的图片时将解码任务交由解码线程进行解码，而负责渲染的线程则可以进行下一网页元素的渲染工作。将图片解码的工作从负责渲染的线程中分离出来，释放了负责渲染的线程的压力，加快了网页渲染渲染速度，能有 效避免浏览网页时产生的卡顿现象。
在优选的实施例中，在图片解码过程中，当检测到用户操作时，例如用户滚动网页，或者打开新网页等等操作。可能会导致网页可视区域发生变化。为此，在本优选实施例中会在网页可视区域发生变化时，检测图片解码任务中的图片是否已不在可视区域预设阈值范围内，若是，则将所述图片对应的图片解码任务及其在所对应的图片映射表中记录的所述图片信息删除。通过上述步骤的处理后，可保证当前正解码的图片，在可视区域范围内，而非可视区域的图片，将不浪费CPU对其进行解码。
在另一优选的实施例中，执行完S260后，浏览器会对已经完成解码的图片的图片解码数据进行缓存。进行图片解码数据缓存是为了尽量减少图片解码时间。
缓存下解码完成后的图片数据，超过缓存阈值时则会进行缓存清理。然而由于在一个页面的可视范围内，图片数据量非常大，导致图片缓存池空间不够用。所以浏览器会出现不断的清理图片缓存，同时解码线程又不断对图片进行解码。这样会导致前一瞬间图片解码数据存在，能够绘制出图片，而随后由于缓存满了，该图片解码数据被清理掉了。此时本实施例会使用另外一个解码线程对该图片进行解码。在解码完成之前，将不渲染显示该图片，所以在此过程中用户将看不到图片，待图片解码完成后，图片又被渲染显示出来，这样会导致页面出现图片不断闪烁的问题。
为了解决上述问题，在优选的实施方式中，在进行图片解码数据缓存清理时，保留缓存中的确定处于可视区域预设阈值范围内的图片的图片解码数据。也就是说在清理缓存中的图片解码数据之前，也会检测准备删除的图片是否存在于可视预设阈值区域中，如果是，则不管缓存是否已满，该图片的图片解码数据均不从缓存中删除。这样有效避免出现进行网页浏览时页面图片不断闪烁的问题。
本优选实施例中的可视区域预设阈值范围跟前面实施例子所讲的可视区域预设阈值范围可以是相同的意思。即可以是当前屏 幕正在显示的区域范围，也可以是当前正在显示范围以外的预设阈值区域范围，例如可以是当前页面以后的一屏页面范围，或者多屏页面范围。
图3示出了本发明的图片渲染装置的第一个实施例的结构框图。
如图3所示，本实施例的图片解码装置包括：负责渲染的线程单元10、解码线程单元20。
所述负责渲染的线程单元10响应者在渲染网页时检测出准备渲染的图片为未解码图片，创建所述图片的图片解码任务以供解码线程单元20根据图片的图片解码任务对所述图片进行解码，获取所述图片的信息，根据获取的图片信息渲染解码线程解码后的图片。
所述解码线程单元20根据图片的图片解码任务对所述图片进行解码。
图4示出了本发明的图片渲染装置的第二个实施例的结构框图。
如图4所示，本实施例的图片渲染装置的所述负责渲染的线程单元10包括：检测模块400、任务创建模块401、任务管理模块402、第一判断模块403、任务选择模块404、线程池构建模块405、第二判断模块406、解码线程创建模块408、通信模块409、信息获取模块410、渲染模块411。所述解码线程单元20包括：解码模块407。
检测模块400用于在渲染线程渲染网页时检测出准备渲染的图片为未解码图片。
渲染线程在渲染过程中是根据排版树的结构逐个对网页元素进行渲染。每个元素的信息可能记录在本地缓存的文件中，当执行渲染时，即渲染线程去相应的文件中获取当前元素的信息执行网页元素的渲染。
图片的图片数据是浏览器根据网页源代码解析出来的图片对应的地址向图片资源服务器请求的获取后存储于本地缓存中。而 从图片资源服务器获取的图片数据在没有经过解码的情况下，渲染线程不能够直接渲染显示。必须先经过解码处理才能进行渲染显示，所以渲染线程在进行网页元素渲染前，首先要由检测模块400检测出网页元素的类型。如果是图片，就要检测图片是否是未解码图片。
检测模块400检测出准备渲染的图片没有解码时，就由任务创建模块401创建所述图片的图片解码任务。
创建完图片解码任务后，任务管理模块402将所述图片解码任务加入图片解码队列中。
此时，可以设置第一判断模块403来判断图片解码线程池是否已经构建。
如果线程池已经构建，则由任务选择模块404从图片解码任务队列选择一个图片解码任务加入解码线程池中。
如果解码线程池还没构建，则由线程池构建模块405构建包含一个或多个解码线程的图片解码线程池。
本领域技术人员应当理解，由于可以预先完成解码线程池的创建工作，因此，负责渲染的线程单元10中也可以不设置第一判断模块403和线程池创建模块405。
第二判断模块406判断解码线程池中是否有可用的解码线程。
如果有可用的解码线程，则由解码模块407对图片进行解码。这里需要解码线程池先唤醒可用的解码线程，然后由可用的解码线程的解码模块407对图片进行解码
如果没有可用的解码线程，则由解码线程创建模块408创建解码线程或者等待解码线程完成解码任务,然后由解码模块407对图片进行解码。
本领域技术人员应当理解，由于可以预先创建足够多的解码线程，因此，负责渲染的线程单元10中也可以不设置第二判断模块406和解码线程创建模块408。
在解码完成之前，渲染模块411继续进行下一网页元素的渲染工作，暂不执行该图片的渲染动作。
解码完成后，通信模块409通知渲染线程进行该图片的渲染。
在进行该图片渲染前，由信息获取模块410获取所述图片的信息。
这里的图片信息包括所述图片需要渲染的位置及大小信息。信息获取模块410其实是从图片映射表中获取所述图片需要渲染的位置及大小信息。
所述图片需要渲染的位置及大小信息是在进行网页排版时计算出来的，在进行网页排版时，负责网页排版的线程对图片进行初步解析得到图片大小，然后根据网页排版需要计算出图片要渲染显示的位置和需要渲染显示的大小。需要注意的是，解析出来的图片大小与图片渲染显示的大小并不一定相同，因为浏览器会综合很多方面的因素，比如显示屏的大小、网页缩放等因素对图片进行缩放。所以从资源服务器获取的图片的大小为100*100像素，最后经过排版计算后需要渲染显示的大小为50*50。
负责排版的线程完成对图片进行初步解析，然后根据网页排版需要计算出图片要渲染显示的位置和需要渲染显示的大小后，将图片要渲染显示的位置和需要渲染显示的大小信息传输给渲染线程，渲染线程收到图片的这些信息后就将这些信息记录在图片映射表中。
图片映射表的key值为图片对象指针，value值为需要绘制的图片的在网页中出现过的所有矩形区域的叠加值。
此图片映射表中记录的图片在网页中要渲染显示的位置包括历史位置和最新的位置，即图片在网页中可能存在的所有位置。由于目前大多数网页为动态网页，图片很可能是不断发生位置、形状等变化。因此，在不同时间段中，图片在网页中所处的位置很可能也不一样。在图片映射表中记录的图片渲染显示的位置是叠加记录每一次网页渲染显示时图片的所在位置。同时由于同一个网页中可能出现多个完全一样的图片，而图片原始数据其实只有一份，所以仅需对一张图片进行解码，但解码完成后，图片可能需要渲染在页面的多个区域。所以本实施例需要在图片映射表 中叠加记录图片出现过的所有位置，即包括历史位置和最新的位置。
在解码模块407完成图片的解码，信息获取模块410又获取到了图片需要渲染的位置和大小信息后，渲染线程的渲染模块411根据获取图片需要渲染的位置和大小信息渲染对已经完成解码的图片进行渲染。
本实施例的图片渲染装置，负责渲染的线程单元在渲染网页元素时检测到未解码图片时，为所述图片创建图片解码任务以供解码线程单元根据图片的图片解码任务对所述图片进行解码，同时负责渲染的线程单元获取所述图片的信息，最后根据记录的图片信息渲染解码线程单元解码的图片。将解码工作从负责渲染的线程单元中分离出来，由解码线程进行图片的解码。在解码线程进行图片解码的时候，负责渲染的渲染线程或者主线程可以进行下一任务的工作，将图片解码的工作分离出来释放了主线程或者渲染线程的压力，加快了网页渲染渲染速度，能有效避免浏览网页时产生的卡顿现象。
图5示出了本发明的图片解码装置的第三个实施例的结构框图。
如图5所示，在优选的实施例中，在图片解码过程中，除了包含图4所示的实施例的模块以外，还包括用户行为检测模块500、检查模块501和第一删除模块502。
用户行为检测模块500用于检测用户操作行为是否导致了网页可视区域发生变化。这里的用户操作行为包括用户滚动网页或者打开新网页等等操作。由于网页可视区域将是不断发生变化的。为此，在本优选实施例中当用户行为检测模块500检测到用户操作导致了网页可视区域发生变化时，检查模块501检查图片解码队列中的图片是否已不在可视区域预设阈值范围内，若是，则由第一删除模块502在图片解码队列中删除所述图片对应的图片解码任务和在图片映射表中删除所述图片需要渲染的位置及大小信息。通过上述步骤的处理后，可保证当前正解码的图片，在可视 区域范围内，而非可视区域的图片，将不浪费CPU时间对其进行解码。
图6示出了本发明的图片解码装置的第四实施例的结构框图。
如图6所示，在优选的实施例中本发明的图片渲染装置，在图片解码过程中，除了包含图4所示的实施例的模块以外，还包括缓存模块600、第二删除模块601和可视范围检测模块602。解码模块407执行完图片解码后，缓存模块600会对已经完成解码的图片的图片解码数据进行缓存。进行图片解码数据缓存是为了尽量减少图片解码时间。
缓存下解码完成后的图片数据，超过缓存阈值时则会由第二删除模块601清理缓存模块600中的已经完成解码的图片的图片解码数据。然而由于在一个页面的可视范围内，图片数据量非常大，导致图片缓存池空间不够用。所以会出现第二删除模块601不断的清理图片缓存，同时又由解码模块407不断对图片进行解码。这样会导致前一瞬间图片解码数据存在，能够绘制出图片，而随后由于缓存满了，该图片解码数据被清理掉了。此时本实施例会使用另外一个线程的解码模块407对该图片进行解码。在解码完成之前，渲染模块411将不渲染显示该图片，所以在此过程中用户将看不到图片，待图片解码完成后，图片又被渲染模块411渲染显示出来，这样会导致页面出现图片不断闪烁的问题。
为了解决上述问题，在优选的实施方式中，在第二删除模块601进行图片解码数据缓存清理时，不清理缓存中的确定处于可视区域预设阈值范围内的图片的图片解码数据。也就是说在清理缓存中的图片解码数据之前，也会由可视范围检测模块602检测准备删除的图片是否存在于可视预设阈值区域中，如果是，则不管缓存是否已满，该图片的图片解码数据均不从缓存中删除。这样有效避免出现页面出现图片不断闪烁的问题。
本优选实施例中的可视区域预设阈值范围跟前面实施例子所讲的可视区域预设阈值范围可以是相同的意思。即可以是当前屏幕正在显示的区域范围，也可以是当前正在显示范围以外的预设 阈值区域范围，例如可以是当前页面后的一屏页面范围，或者多屏页面范围。
图7为本发明的移动终端一个实施例的系统结构图。
如图7所示，本发明的移动终端包含浏览器引擎、渲染引擎、网络、JS解释器和存储器。
其中用户界面包括地址栏、后退/前进按钮、书签目录等，也就是用户所看到的除了用来显示用户所请求页面的主窗口之外的其他部分。
浏览器引擎用于查询及操作渲染引擎的接口。
渲染引擎用于显示用户请求的网页内容，例如，如果请求内容为html，负责解析html及css，并将解析后的结果显示出来。即负责网页解析、排版、渲染绘制网页内容到屏幕。
网络用于完成网络调用，例如通过渲染引擎解析出来的网页存在http请求，则根据http请求去网络服务器获取对应的网页资源，例如图片、视频等。然后供渲染引擎进行渲染显示。网络具有平台无关的接口，可以在不同平台上工作。
JS解释器用来解释执行JS代码。JS代码是渲染引擎通过网页解析后，发现存在JS代码，然后交由JS解释器对JS代码进行解释执行。
存储器包括永久性存储器和缓存。移动终端的浏览器需要在硬盘中保存类似cookie的各种数据，HTML5定义了web database技术，是一种轻量级完整的客户端存储技术。渲染引擎的图片渲染装置从存储器中获取图片数据进行图片渲染。
其中所述渲染引擎包括图片渲染装置。所述图片渲染装置包括负责渲染的线程单元10和解码线程单元20。负责渲染的线程单元10在渲染网页时检测出准备渲染的图片为未解码图片，则创建所述图片的图片解码任务以供解码线程单元20根据图片的图片解码任务对所述图片进行解码；
然后，负责渲染的线程单元10获取所述图片的信息。
然后，负责渲染的线程单元10根据获取的图片信息渲染解码 线程单元20解码后的图片。
本领域普通技术人员可以意识到，图7仅仅是本发明的包含本发明的图片渲染装置的移动终端的一种架构图，还存在很多变形的架构，或者还包含其它类似功能的模块。只要该移动终端的包含了本发明的图片渲染装置则视为本发明所保护的移动终端的变形。
本领域普通技术人员可以意识到，结合本文中所公开的实施例描述的各示例的模块及算法步骤，能够以电子硬件、或者计算机软件和电子硬件的结合来实现。这些功能究竟以硬件还是软件方式来执行，取决于技术方案的特定应用和设计约束条件。专业技术人员可以对每个特定的应用来使用不同方法来实现所描述的功能，但是这种实现不应认为超出本发明的范围。
所属领域的技术人员可以清楚地了解到，为描述的方便和简洁，上述描述的系统、装置和模块的具体工作过程，可以参考前述方法实施例中的对应过程，在此不再赘述。
在本申请所提供的几个实施例中，应该理解到，所揭露的系统、装置和方法，可以通过其它的方式实现。例如，以上所描述的装置实施例仅仅是示意性的，例如，所述模块的划分，仅仅为一种逻辑功能划分，实际实现时可以有另外的划分方式，例如多个模块或组件可以结合或者可以集成到另一个系统，或一些特征可以忽略，或不执行。另一点，所显示或讨论的相互之间的耦合或直接耦合或通信连接可以是通过一些接口，装置或模块的间接耦合或通信连接，可以是电性，机械或其它的形式。
所述作为分离部件说明的模块可以是或者也可以不是物理上分开的，作为模块显示的部件可以是或者也可以不是物理模块，即可以位于一个地方，或者也可以分布到多个网络模块上。可以根据实际的需要选择其中的部分或者全部模块来实现本实施例方案的目的。
另外，在本发明各个实施例中的各功能模块可以集成在一个处理模块中，也可以是各个模块单独物理存在，也可以两个或两 个以上模块集成在一个模块中。
所述功能如果以软件功能模块的形式实现并作为独立的产品销售或使用时，可以存储在一个机器可读取存储介质中。基于这样的理解，本发明的技术方案本质上或者说对现有技术做出贡献的部分或者该技术方案的部分可以以软件产品的形式体现出来，该计算机软件产品存储在一个存储介质中，包括若干指令用以使得一台计算设备(可以是个人计算机，服务器，移动终端如手机，或者网络设备等)或处理器(processor)执行本发明各个实施例所述方法的全部或部分步骤。而前述的存储介质包括：U盘、移动硬盘、只读存储器(ROM，Read-Only Memory)、随机存取存储器(RAM，Random Access Memory)、磁碟或者光盘等各种可以存储程序代码的介质。
因此，本发明的上述技术构思可以被实施为一种非暂时性机器可读存储介质，其上存储有可执行代码。当该可执行代码被处理器执行时，使该处理器执行上文所述的方法。
另一方面，本发明的上述技术构思还可以被实施为一种计算设备，该计算设备包括处理器和非暂时性机器可读存储介质。该非暂时性机器可读存储介质上存储有可执行代码。当该可执行代码被该处理器执行时，使该处理器执行上文所述的方法。
以上所述，仅为本发明的具体实施方式，但本发明的保护范围并不局限于此，任何熟悉本技术领域的技术人员在本发明揭露的技术范围内，可轻易想到变化或替换，都应涵盖在本发明的保护范围之内。因此，本发明的保护范围应所述以权利要求的保护范围为准。

Claims (14)

  1. 一种图片渲染方法，包括：
    响应于负责渲染的线程在渲染网页时检测出准备渲染的图片为未解码图片，创建所述图片的图片解码任务以供解码线程根据图片的图片解码任务对所述图片进行解码；
    获取所述图片的信息；
    根据获取的图片信息渲染所述解码线程解码后的图片。
  2. 如权利要求1所述的图片渲染方法，还包括：
    构建包含一个或多个解码线程的图片解码线程池；
    所述图片的图片解码任务创建完成后，由图片解码线程池中一个可用解码线程对所述图片进行解码。
  3. 如权利要求1所述的图片渲染方法，还包括：将所述图片解码任务加入图片解码队列，所述解码线程根据图片解码队列对所述图片进行解码。
  4. 如权利要求3所述的图片渲染方法，其中，负责渲染的线程获取所述图片的信息包括：负责渲染的线程从图片映射表中获取所述图片需要渲染的位置及大小信息；
    其中，负责渲染的线程根据获取的图片信息渲染解码线程解码后的图片包括：负责渲染的线程根据从图片映射表中获取的所述图片需要渲染的位置及大小信息渲染所述解码线程解码后的图片。
  5. 如权利要求4所述的图片渲染方法，还包括：
    当检测到图片不在可视区域的预设范围内时，在图片解码队列中删除所述图片对应的图片解码任务和/或在所述图片映射表删除所述图片的信息。
  6. 如权利要求1-5任意一项所述的图片渲染方法，还包括：
    对已经完成解码的图片的图片解码数据进行缓存；
    在进行图片解码数据缓存清理时，保留缓存中的确定处于可视区域预设阈值范围内的图片的图片解码数据。
  7. 一种图片渲染装置，包括负责渲染的线程单元、解码线程单元，
    所述负责渲染的线程单元响应于在渲染网页时检测出准备渲染的图片为未解码图片，创建所述图片的图片解码任务以供解码线程单元根据图片的图片解码任务对所述图片进行解码，获取所述图片的信息，根据获取的图片信息渲染解码线程解码后的图片；
    所述解码线程单元根据图片的图片解码任务对所述图片进行解码。
  8. 如权利要求7所述的图片渲染装置，
    其中，所述负责渲染的线程单元包括：
    检测模块，用于在渲染网页时检测出准备渲染的图片为未解码图片；
    任务创建模块，用于创建所述图片的图片解码任务；
    信息获取模块，用于获取所述图片的信息；
    渲染模块，用于根据信息获取模块获取的图片信息渲染已经完成解码的图片；
    其中，所述解码线程单元包括：
    解码模块，用于根据图片的图片解码任务对图片进行解码。
  9. 如权利要求7所述的图片渲染装置，其中，所述负责渲染的线程单元还包括：线程池构建模块，所述线程池构建模块用于构建包括至少一个解码线程的图片解码线程池。
  10. 如权利要求7所述的图片渲染装置，其中，所述负责渲染的线程单元还包括：任务管理模块，用于将所述图片解码任务加入图片解码队列以供所述解码线程单元的解码模块根据图片解码队列对所述图片进行解码。
  11. 如权利要求9或10所述的图片渲染装置，还包括：
    用户行为检测模块，用于检测用户操作行为是否导致了网页可视区域发生变化；
    检查模块，用于在用户行为检测模块检测到用户操作时，检查图片解码队列中的图片是否已不在可视区域预设阈值范围内；
    第一删除模块，用于检查模块检查出图片不在所述可视区域预设阈值范围内时，在图片解码队列中删除所述图片对应的图片解码任务和在图片映射表中删除所述图片需要渲染的位置及大小信息。
  12. 如权利要求7-10任意一项所述的图片渲染装置，还包括：
    缓存模块，用于缓存已经完成解码的图片的图片解码数据；
    第二删除模块，用于清理缓存模块中的已经完成解码的图片的图片解码数据，其中第二删除模块在清理缓存模块中的图片解码数据时，保留缓存模块中的确定处于可视区域预设阈值范围内的图片的图片解码数据。
  13. 一种移动终端，包括存储器和图片渲染装置，所述图片渲染装置从存储器中获取图片数据以进行图片渲染，
    所述图片渲染装置包括负责渲染的线程单元、解码线程单元，
    所述负责渲染的线程单元响应于在渲染网页时检测出准备渲染的图片为未解码图片，创建所述图片的图片解码任务以供解码线程单元根据图片的图片解码任务对所述图片进行解码，获取所述图片的信息，根据获取的图片信息渲染解码线程解码后的图片；
    所述解码线程单元根据图片的图片解码任务对所述图片进行 解码。
  14. 一种非暂时性机器可读存储介质，其上存储有可执行代码，当所述可执行代码被处理器执行时，使所述处理器执行以下步骤：
    响应于负责渲染的线程在渲染网页时检测出准备渲染的图片为未解码图片，创建所述图片的图片解码任务以供解码线程根据图片的图片解码任务对所述图片进行解码；
    获取所述图片的信息；
    根据获取的图片信息渲染所述解码线程解码后的图片。
PCT/CN2015/088566 2014-09-03 2015-08-31 图片渲染方法和装置、移动终端以及机器可读存储介质 Ceased WO2016034089A1 (zh)

Applications Claiming Priority (2)

Application Number Priority Date Filing Date Title
CN201410446924.4A CN105389159A (zh) 2014-09-03 2014-09-03 图片渲染方法、装置和移动终端
CN201410446924.4 2014-09-03

Publications (1)

Publication Number Publication Date
WO2016034089A1 true WO2016034089A1 (zh) 2016-03-10

Family

ID=55421468

Family Applications (1)

Application Number Title Priority Date Filing Date
PCT/CN2015/088566 Ceased WO2016034089A1 (zh) 2014-09-03 2015-08-31 图片渲染方法和装置、移动终端以及机器可读存储介质

Country Status (2)

Country Link
CN (1) CN105389159A (zh)
WO (1) WO2016034089A1 (zh)

Cited By (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN108632540A (zh) * 2017-03-23 2018-10-09 北京小唱科技有限公司 视频处理方法和装置
CN109840195A (zh) * 2017-11-29 2019-06-04 腾讯科技（武汉）有限公司 网页性能分析方法、终端设备及计算机可读存储介质
CN111127296A (zh) * 2019-12-24 2020-05-08 北京恒泰实达科技股份有限公司 一种在大屏可视化系统中高效图片渲染方法
CN111243044A (zh) * 2020-01-06 2020-06-05 福建天泉教育科技有限公司 含图片网页的pdf转码方法、存储介质
CN115222865A (zh) * 2022-07-29 2022-10-21 深圳市瑞云科技有限公司 一种渲染异常退出继续渲染的方法
CN115268720A (zh) * 2022-08-16 2022-11-01 北京尽微致广信息技术有限公司 一种页面渲染方法、装置、设备及可读存储介质

Families Citing this family (9)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN107506176B (zh) 2016-06-14 2019-07-12 华为技术有限公司 一种确定解码任务的方法和装置
CN106354512A (zh) * 2016-09-08 2017-01-25 广州华多网络科技有限公司 用户界面渲染方法及装置
CN109213607B (zh) * 2017-06-30 2021-07-23 武汉斗鱼网络科技有限公司 一种多线程渲染的方法和装置
CN108093293B (zh) * 2018-01-15 2021-01-22 北京奇艺世纪科技有限公司 一种视频渲染方法及系统
CN108549562A (zh) * 2018-03-16 2018-09-18 阿里巴巴集团控股有限公司 一种图像加载的方法及装置
CN111163345B (zh) * 2018-11-07 2021-11-26 杭州海康威视系统技术有限公司 一种图像渲染方法及装置
CN113506298A (zh) * 2021-09-10 2021-10-15 北京市商汤科技开发有限公司 图像检测与渲染方法及装置、设备、存储介质
CN114862999A (zh) * 2022-07-11 2022-08-05 杭州安恒信息技术股份有限公司 一种打点渲染方法、装置、设备及存储介质
CN116597062B (zh) * 2023-07-10 2024-02-09 北京麟卓信息科技有限公司 一种基于动态自适应解码的压缩纹理渲染优化方法

Citations (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US6430591B1 (en) * 1997-05-30 2002-08-06 Microsoft Corporation System and method for rendering electronic images
CN102591853A (zh) * 2011-12-29 2012-07-18 优视科技有限公司 网页重排方法、网页重排装置以及移动终端
CN102789484A (zh) * 2012-06-28 2012-11-21 奇智软件（北京）有限公司 一种网页信息处理方法和装置
CN102831209A (zh) * 2012-08-13 2012-12-19 优视科技有限公司 网页浏览的渲染处理方法及装置和移动终端
CN102915375A (zh) * 2012-11-08 2013-02-06 山东大学 一种基于布局分区的网页加载方法
CN103678526A (zh) * 2013-11-29 2014-03-26 贝壳网际（北京）安全技术有限公司 浏览器解码图片的方法、装置和客户端

Family Cites Families (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN101458824B (zh) * 2009-01-08 2011-06-15 浙江大学 一种基于web的全景图的光照渲染方法

Patent Citations (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US6430591B1 (en) * 1997-05-30 2002-08-06 Microsoft Corporation System and method for rendering electronic images
CN102591853A (zh) * 2011-12-29 2012-07-18 优视科技有限公司 网页重排方法、网页重排装置以及移动终端
CN102789484A (zh) * 2012-06-28 2012-11-21 奇智软件（北京）有限公司 一种网页信息处理方法和装置
CN102831209A (zh) * 2012-08-13 2012-12-19 优视科技有限公司 网页浏览的渲染处理方法及装置和移动终端
CN102915375A (zh) * 2012-11-08 2013-02-06 山东大学 一种基于布局分区的网页加载方法
CN103678526A (zh) * 2013-11-29 2014-03-26 贝壳网际（北京）安全技术有限公司 浏览器解码图片的方法、装置和客户端

Cited By (10)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN108632540A (zh) * 2017-03-23 2018-10-09 北京小唱科技有限公司 视频处理方法和装置
CN108632540B (zh) * 2017-03-23 2020-07-03 北京小唱科技有限公司 视频处理方法和装置
CN109840195A (zh) * 2017-11-29 2019-06-04 腾讯科技（武汉）有限公司 网页性能分析方法、终端设备及计算机可读存储介质
CN109840195B (zh) * 2017-11-29 2023-05-12 腾讯科技（武汉）有限公司 网页性能分析方法、终端设备及计算机可读存储介质
CN111127296A (zh) * 2019-12-24 2020-05-08 北京恒泰实达科技股份有限公司 一种在大屏可视化系统中高效图片渲染方法
CN111127296B (zh) * 2019-12-24 2023-05-26 北京恒泰实达科技股份有限公司 一种在大屏可视化系统中高效图片渲染方法
CN111243044A (zh) * 2020-01-06 2020-06-05 福建天泉教育科技有限公司 含图片网页的pdf转码方法、存储介质
CN115222865A (zh) * 2022-07-29 2022-10-21 深圳市瑞云科技有限公司 一种渲染异常退出继续渲染的方法
CN115268720A (zh) * 2022-08-16 2022-11-01 北京尽微致广信息技术有限公司 一种页面渲染方法、装置、设备及可读存储介质
CN115268720B (zh) * 2022-08-16 2024-06-11 北京尽微致广信息技术有限公司 一种页面渲染方法、装置、设备及可读存储介质

Also Published As

Publication number Publication date
CN105389159A (zh) 2016-03-09

Similar Documents

Publication Publication Date Title
WO2016034089A1 (zh) 图片渲染方法和装置、移动终端以及机器可读存储介质
JP4626703B2 (ja) 情報処理装置、情報処理方法および情報処理プログラム
WO2019042329A1 (zh) 一种用户界面渲染的方法及装置
US9195772B2 (en) Delayed image decoding
WO2014206072A1 (zh) 预览网页的方法及系统
CN104484235B (zh) 一种基于瀑布流技术的内存优化方法及装置
US20140222947A1 (en) Method and apparatus for browsings webpages, and storage medium
WO2015090064A1 (zh) 页面渲染方法及装置
EP2805258A1 (en) Low resolution placeholder content for document navigation
CN103744932A (zh) 一种页面处理方法及装置
CN104077387A (zh) 一种网页内容显示方法和浏览器装置
WO2016107325A1 (zh) 基于移动终端的页面资源加载方法及装置
CN103336787B (zh) 一种用于缩放网页的方法和装置
CN108228816A (zh) 一种瀑布流图片的加载方法和装置
US9679075B1 (en) Efficient delivery of animated image files
WO2025020756A1 (zh) 自适应可视区域的显示方法、装置、系统及介质
CN111915705A (zh) 图片可视化编辑方法、装置、设备和介质
CN112149039A (zh) 一种提升前端网页加载速度的方法
CN107153650A (zh) 一种图片加载方法及装置
EP3460656B1 (en) Method and apparatus for determining decoding task
CN114489446A (zh) 数据处理方法、装置、设备及可读存储介质
US10261979B2 (en) Method and apparatus for rendering a screen-representation of an electronic document
WO2018137470A1 (zh) 用户终端及网页图片资源加载装置与方法、存储介质
CN106557529B (zh) 页面跳转中的跳转页面展示方法和装置
WO2014187202A1 (zh) 实现网页布局的方法、装置、终端及计算机存储介质

Legal Events

Date Code Title Description
121 Ep: the epo has been informed by wipo that ep was designated in this application

Ref document number: 15838096

Country of ref document: EP

Kind code of ref document: A1

NENP Non-entry into the national phase

Ref country code: DE

122 Ep: pct application non-entry in european phase

Ref document number: 15838096

Country of ref document: EP

Kind code of ref document: A1