圖片渲染方法、裝置和移動終端的制作方法
【技術領域】
[0001]本發(fā)明涉及移動通信技術領域，更為具體地，涉及圖片渲染方法、裝置及移動終端。
【背景技術】
[0002]網頁頁面中包含很多網頁元素，例如圖片，文字還有視頻等。目前Chrome、android自帶瀏覽器及第三方瀏覽器(如UC瀏覽器)等瀏覽器的渲染工作有兩種執(zhí)行方式，一種是在主線程完成，一種是在渲染線程完成。兩種方式在網頁渲染時執(zhí)行方式類似。在頁面渲染的過程中，如發(fā)現(xiàn)需要渲染的圖片未進行圖片解碼，則首先需對該圖片進行解碼，解碼完成后再對圖片進行渲染，之后才能進行下一網頁元素的處理。
[0003]在網頁渲染過程中圖片解碼是一個很耗時的工作。特別對于擁有多圖或者大圖的網頁來說，圖片解碼耗時是影響網頁渲染效率最主要的因素，也是影響瀏覽器整體性能的主要因素。如果網頁圖片過大或者網頁圖片很多都會導致網頁渲染速度慢，網頁渲染效率低。在主線程或者渲染線程進行大圖片渲染或者多圖片網頁的渲染時，由于主線程或者渲染線程正在進行圖片解碼，而不能執(zhí)行其它任務，導致主線程或者渲染線程的網頁渲染效率低，甚至出現(xiàn)堵塞出現(xiàn)卡頓現(xiàn)象。
[0004]同時如果在渲染線程或者主線程網頁渲染過程中正在進行圖片的解碼，此時用戶進行屏幕操作，比如劃屏或者點擊網頁的控件等，由于此時主線程或者渲染線程正在進行圖片解碼，而不能執(zhí)行其它任務，瀏覽器也出現(xiàn)卡頓現(xiàn)象。
[0005]所以，現(xiàn)有方法中，瀏覽器的渲染線程或者主線程在進行網頁的大圖渲染或者多圖渲染時，由于在進行圖片的解碼，而不能進行其它工作會導致瀏覽器出現(xiàn)渲染速度慢，效率低，甚至出現(xiàn)阻塞卡頓或者會導致用戶劃屏卡頓。

【發(fā)明內容】

[0006]鑒于上述問題，本發(fā)明的目的是提供一種圖片渲染方法、裝置及移動終端，能加快網頁渲染的渲染速度，有效避免瀏覽網頁時產生的卡頓現(xiàn)象。
[0007]根據(jù)本發(fā)明的一個方面，提供一種圖片渲染方法，包括:
[0008]負責渲染的線程在渲染網頁時檢測出準備渲染的圖片為未解碼圖片，則創(chuàng)建所述圖片的圖片解碼任務以供解碼線程根據(jù)圖片的圖片解碼任務對所述圖片進行解碼；
[0009]獲取所述圖片的信息；
[0010]根據(jù)獲取的圖片信息渲染所述解碼線程解碼后的圖片。
[0011]還包括:構建包含一個或多個解碼線程的圖片解碼線程池；
[0012]所述圖片的圖片解碼任務創(chuàng)建完成后，由圖片解碼線程池中一個可用解碼線程對所述圖片進行解碼。
[0013]還包括:將所述圖片解碼任務加入圖片解碼隊列，所述解碼線程根據(jù)圖片解碼隊列對所述圖片進行解碼。
[0014]其中，負責渲染的線程獲取所述圖片的信息包括:負責渲染的線程從圖片映射表中獲取所述圖片需要渲染的位置及大小信息；
[0015]其中，負責渲染的線程根據(jù)獲取的圖片信息渲染解碼線程解碼后的圖片包括:
[0016]負責渲染的線程根據(jù)從圖片映射表中獲取的所述圖片需要渲染的位置及大小信息渲染所述解碼線程解碼后的圖片。
[0017]還包括:當檢測到圖片不在可視區(qū)域的預設范圍內時，則在圖片解碼隊列中刪除所述圖片對應的圖片解碼任務和/或在所述圖片映射表刪除所述圖片的信息。
[0018]還包括:對已經完成解碼的圖片的圖片解碼數(shù)據(jù)進行緩存；
[0019]在進行圖片解碼數(shù)據(jù)緩存清理時，保留緩存中的確定處于可視區(qū)域預設閾值范圍內的圖片的圖片解碼數(shù)據(jù)。
[0020]另一方面，本發(fā)明還提供一種圖片渲染裝置，包括:負責渲染的線程單元、解碼線程單元，
[0021]所述負責渲染的線程單元，用于在渲染網頁時檢測出準備渲染的圖片為未解碼圖片，則創(chuàng)建所述圖片的圖片解碼任務以供解碼線程單元根據(jù)圖片的圖片解碼任務對所述圖片進行解碼，獲取所述圖片的信息，根據(jù)獲取的圖片信息渲染解碼線程解碼后的圖片；
[0022]所述解碼線程單元，用于根據(jù)圖片的圖片解碼任務對所述圖片進行解碼。
[0023]其中，所述負責渲染的線程單元包括:
[0024]檢測模塊，用于在渲染網頁時檢測出準備渲染的圖片為未解碼圖片；
[0025]任務創(chuàng)建模塊，用于創(chuàng)建所述圖片的圖片解碼任務；
[0026]信息獲取模塊，用于獲取所述圖片的信息；
[0027]渲染模塊，用于根據(jù)信息獲取模塊獲取的圖片信息渲染已經完成解碼的圖片；
[0028]其中，所述解碼線程單元包括:
[0029]解碼模塊，用于根據(jù)圖片的圖片解碼任務對圖片進行解碼。
[0030]其中，所述負責渲染的線程單元還包括:線程池構建模塊，所述線程池構建模塊用于構建包括至少一個解碼線程的圖片解碼線程池。
[0031]其中，所述負責渲染的線程單元還包括:任務管理模塊，用于將所述圖片解碼任務加入圖片解碼隊列以供所述解碼線程單元的解碼模塊根據(jù)圖片解碼隊列對所述圖片進行解碼。
[0032]還包括:
[0033]用戶行為檢測模塊，用于檢測用戶操作行為是否導致了網頁可視區(qū)域發(fā)生變化；
[0034]檢查模塊，用于在用戶行為檢測模塊檢測到用戶操作時，檢查圖片解碼隊列中的圖片是否已不在可視區(qū)域預設閾值范圍內；
[0035]第一刪除模塊，用于檢查模塊檢查出圖片不在所述可視區(qū)域預設閾值范圍內時，在圖片解碼隊列中刪除所述圖片對應的圖片解碼任務和在圖片映射表中刪除所述圖片需要渲染的位置及大小信息。
[0036]還包括:緩存模塊，用于緩存已經完成解碼的圖片的圖片解碼數(shù)據(jù)；
[0037]第二刪除模塊，用于清理緩存模塊中的已經完成解碼的圖片的圖片解碼數(shù)據(jù)。
[0038]本發(fā)明還提供一種移動終端，包括存儲器、圖片渲染裝置，
[0039]所述圖片渲染裝置包括負責渲染的線程單元、解碼線程單元，
[0040]所述負責渲染的線程單元，用于在渲染網頁時檢測出準備渲染的圖片為未解碼圖片，則創(chuàng)建所述圖片的圖片解碼任務以供解碼線程單元根據(jù)圖片的圖片解碼任務對所述圖片進行解碼，獲取所述圖片的信息，根據(jù)獲取的圖片信息渲染解碼線程解碼后的圖片；
[0041]所述解碼線程單元，用于根據(jù)圖片的圖片解碼任務對所述圖片進行解碼；
[0042]所述圖片渲染裝置從存儲器中獲取圖片數(shù)據(jù)進行圖片渲染。
[0043]本發(fā)明的圖片渲染方法、裝置和移動終端，負責渲染的線程在渲染網頁元素時檢測到未解碼圖片時，記錄所述圖片的信息，然后為所述圖片創(chuàng)建圖片解碼任務以供解碼線程根據(jù)圖片的圖片解碼任務對所述圖片進行解碼；最后負責渲染的線程根據(jù)獲取的圖片信息渲染解碼線程解碼的圖片。由于本發(fā)明使用單獨解碼線程進行圖片解碼，使得負責渲染的線程能夠在檢測到未解碼的圖片時將解碼任務交由解碼線程進行解碼，從而負責渲染的線程則可以進行下一網頁元素的渲染工作。該方法將圖片解碼的工作從負責渲染的線程中分離出來，釋放了負責渲染的線程的壓力，加快了網頁渲染的渲染速度，能有效避免瀏覽網頁時產生的卡頓現(xiàn)象。
[0044]為了實現(xiàn)上述以及相關目的，本發(fā)明的一個或多個方面包括后面將詳細說明并在權利要求中特別指出的特征。下面的說明以及附圖詳細說明了本發(fā)明的某些示例性方面。然而，這些方面指示的僅僅是可使用本發(fā)明的原理的各種方式中的一些方式。此外，本發(fā)明旨在包括所有這些方面以及它們的等同物。
【附圖說明】
[0045]通過參考以下結合附圖的說明及權利要求書的內容，并且隨著對本發(fā)明的更全面理解，本發(fā)明的其它目的及結果將更加明白及易于理解。在附圖中:
[0046]圖1示出了根據(jù)本發(fā)明圖片渲染方法的一個實施例的流程圖；
[0047]圖2示出了本發(fā)明的圖片渲染方法另一個實施例的詳細流程圖；
[0048]圖3示出了本發(fā)明的圖片渲染裝置的第一個實施例的結構框圖；
[0049]圖4示出了本發(fā)明的圖片渲染裝置的第二個實施例的結構框圖；
[0050]圖5示出了本發(fā)明的圖片解碼裝置的第三個實施例的結構框圖；
[0051]圖6示出了本發(fā)明的圖片解碼裝置的第四個實施例的結構框圖；
[0052]圖7為本發(fā)明的移動終端一個實施例的系統(tǒng)結構圖。
[0053]在所有附圖中相同的標號指示相似或相應的特征或功能。
【具體實施方式】
[0054]以下將結合附圖對本發(fā)明的具體實施例進行詳細描述。
[0055]本發(fā)明的圖片渲染方法、裝置和移動終端，負責渲染的線程在渲染網頁元素時檢測到未解碼圖片時，記錄所述圖片的信息，然后為所述圖片創(chuàng)建圖片解碼任務以供解碼線程根據(jù)圖片的圖片解碼任務對所述圖片進行解碼；最后負責渲染的線程根據(jù)獲取的圖片信息渲染解碼線程解碼的圖片。由于本發(fā)明使用單獨解碼線程進行圖片解碼，使得負責渲染的線程能夠在檢測到未解碼的圖片時將解碼任務交由解碼線程進行解碼，而負責渲染的線程則可以進行下一網頁元素的渲染工作。將圖片解碼的工作從負責渲染的線程中分離出來，釋放了負責渲染的線程的壓力，加快了網頁渲染渲染速度，能有效避免瀏覽網頁時產生的卡頓現(xiàn)象。
[0056]通常情況下，在網頁元素的渲染顯示是在渲染線程完成的，本發(fā)明的下面的實施例以渲染線程執(zhí)行渲染顯示為例進行說明，即負責渲染的線程為渲染線程進行具體說明。本領域技術人員應該理解，在網頁元素的渲染顯示也可能是在主線程執(zhí)行，執(zhí)行原理與渲染線程類似，這里不贅述。
[0057]圖1示出了根據(jù)本發(fā)明圖片渲染方法的一個實施例的流程圖。
[0058]如圖1所示本實施例的圖