Gif圖像渲染方法及裝置的制造方法
【專利摘要】本公開揭示了一種GIF圖像渲染方法及裝置，屬于圖像處理領(lǐng)域。所述GIF圖像渲染方法包括：通過檢測(cè)網(wǎng)頁中的GIF圖像是否位于瀏覽器的顯示區(qū)中；網(wǎng)頁是指被瀏覽器加載的網(wǎng)頁，GIF圖像包括n幀子圖像；若GIF圖像位于瀏覽器的顯示區(qū)之外，則暫停對(duì)GIF圖像中的子圖像的渲染操作；解決了當(dāng)用戶滾動(dòng)網(wǎng)頁，使得GIF圖像處于瀏覽器的顯示區(qū)之外時(shí)，瀏覽器仍然對(duì)GIF圖像中的每一幀單幀圖像進(jìn)行渲染，導(dǎo)致CPU資源的大量浪費(fèi)的問題；達(dá)到了當(dāng)GIF圖像位于瀏覽器的顯示區(qū)之外時(shí)，暫停對(duì)GIF圖像中的子圖像的渲染操作，提高了瀏覽器的渲染性能，在不影響用戶體驗(yàn)的同時(shí)節(jié)省了CPU的計(jì)算資源的效果。
【專利說明】
GIF圖像渲染方法及裝置
技術(shù)領(lǐng)域
[0001 ]本公開涉及圖像處理領(lǐng)域，特別涉及一種GIF圖像渲染方法及裝置。
【背景技術(shù)】
[0002]圖像互換格式(Graphics Interchange Format，GIF)圖像可由多幀單幀圖像組成。在定時(shí)器控制下，GIF圖像通過依次顯示各個(gè)單幀圖像而產(chǎn)生動(dòng)畫效果。
[0003]GIF圖像被廣泛應(yīng)用于網(wǎng)頁中。當(dāng)網(wǎng)頁中的GIF圖像出現(xiàn)在瀏覽器的顯示區(qū)時(shí)，瀏覽器通過定時(shí)器機(jī)制依次對(duì)GIF圖像中的每一幀單幀圖像進(jìn)行渲染，從而給用戶呈現(xiàn)非常好的動(dòng)畫效果。但是，當(dāng)用戶滾動(dòng)網(wǎng)頁，使得GIF圖像處于瀏覽器的顯示區(qū)之外時(shí)，瀏覽器仍然會(huì)對(duì)GIF圖像中的每一幀單幀圖像進(jìn)行清染，從而導(dǎo)致中央處理器(Central ProcessingUnit，CPU)資源的大量浪費(fèi)。
【發(fā)明內(nèi)容】
[0004]為了解決當(dāng)用戶滾動(dòng)網(wǎng)頁，使得GIF圖像處于瀏覽器的顯示區(qū)之外時(shí)，瀏覽器仍然對(duì)GIF圖像中的每一幀單幀圖像進(jìn)行渲染，導(dǎo)致CPU資源的大量浪費(fèi)的問題，本公開提供一種GIF圖像渲染方法及裝置。所述技術(shù)方案如下:
[0005]根據(jù)本公開實(shí)施例的第一方面，提供一種GIF圖像渲染方法，該方法包括:
[0006]檢測(cè)網(wǎng)頁中的GIF圖像是否位于瀏覽器的顯示區(qū)中；網(wǎng)頁是指被瀏覽器加載的網(wǎng)頁，GIF圖像包括η幀子圖像；
[0007]若GIF圖像位于瀏覽器的顯示區(qū)之外，則暫停對(duì)GIF圖像中的子圖像的渲染操作。
[0008]可選的，檢測(cè)網(wǎng)頁中的GIF圖像是否位于瀏覽器的顯示區(qū)中，包括:
[0009]獲取第一區(qū)域信息，第一區(qū)域信息用于指示瀏覽器的顯示區(qū)在網(wǎng)頁中對(duì)應(yīng)的第一區(qū)域；
[0010]獲取第二區(qū)域信息，第二區(qū)域信息用于指示GIF圖像在網(wǎng)頁中對(duì)應(yīng)的第二區(qū)域；
[0011]根據(jù)第一區(qū)域信息和第二區(qū)域信息，檢測(cè)第一區(qū)域和第二區(qū)域是否存在交集，交集用于表示GIF圖像位于瀏覽器的顯示區(qū)中。
[0012]可選的，獲取第一區(qū)域信息，包括:
[0013]在網(wǎng)頁被加載后或者接收到移動(dòng)信號(hào)時(shí)，調(diào)用瀏覽器的內(nèi)核提供的預(yù)定函數(shù)接口獲取第一區(qū)域信息，第一區(qū)域信息包括第一區(qū)域的左頂點(diǎn)位置、橫向長(zhǎng)度和縱向長(zhǎng)度。
[0014]可選的，獲取第二區(qū)域信息，包括:
[0015]從渲染圖像列表中獲取與GIF圖像對(duì)應(yīng)的第二區(qū)域信息，第二區(qū)域信息包括第二區(qū)域的左頂點(diǎn)位置、橫向長(zhǎng)度和縱向長(zhǎng)度。
[0016]可選的，暫停對(duì)GIF圖像中的子圖像的渲染操作，包括:
[0017]向?yàn)g覽器的內(nèi)核提供的GIF圖像渲染組件發(fā)送第一指令，第一指令用于觸發(fā)GIF圖像渲染組件將與GIF圖像對(duì)應(yīng)的定時(shí)器暫停，定時(shí)器用于在第i次超時(shí)后觸發(fā)GIF圖像渲染組件對(duì)GIF圖像中的第k張子圖像進(jìn)行渲染，定時(shí)器在每次超時(shí)后重置，k=i mod η。
[0018]可選的，該方法還包括:
[0019]若GIF圖像位于瀏覽器的顯示區(qū)中，則執(zhí)行對(duì)GIF圖像中的子圖像的渲染操作。
[0020]可選的，執(zhí)行對(duì)GIF圖像中的子圖像的渲染操作，包括:
[0021]向?yàn)g覽器的內(nèi)核提供的GIF圖像渲染組件發(fā)送第二指令，第二指令用于觸發(fā)GIF圖像渲染組件將與GIF圖像對(duì)應(yīng)的定時(shí)器開啟，定時(shí)器用于在第i次超時(shí)后觸發(fā)GIF圖像渲染組件對(duì)GIF圖像中的第k張子圖像進(jìn)行渲染，定時(shí)器在每次超時(shí)后重置，k=i mod η。
[0022]根據(jù)本公開實(shí)施例的第二方面，提供一種GIF圖像渲染裝置，該裝置包括:
[0023]檢測(cè)模塊，被配置為檢測(cè)網(wǎng)頁中的GIF圖像是否位于瀏覽器的顯示區(qū)中；網(wǎng)頁是指被瀏覽器加載的網(wǎng)頁，GIF圖像包括η幀子圖像；
[0024]暫停模塊，被配置為在GIF圖像位于瀏覽器的顯示區(qū)之外時(shí)，暫停對(duì)GIF圖像中的子圖像的渲染操作。
[0025]可選的，檢測(cè)模塊，包括:
[0026]第一獲取子模塊，被配置為獲取第一區(qū)域信息，第一區(qū)域信息用于指示瀏覽器的顯示區(qū)在網(wǎng)頁中對(duì)應(yīng)的第一區(qū)域；
[0027]第二獲取子模塊，被配置為獲取第二區(qū)域信息，第二區(qū)域信息用于指示GIF圖像在網(wǎng)頁中對(duì)應(yīng)的第二區(qū)域；
[0028]交集檢測(cè)子模塊，被配置為根據(jù)第一區(qū)域信息和第二區(qū)域信息，檢測(cè)第一區(qū)域和第二區(qū)域是否存在交集，交集用于表示GIF圖像位于瀏覽器的顯示區(qū)中。
[0029]可選的，第一獲取子模塊，被配置為在網(wǎng)頁被加載后或者接收到移動(dòng)信號(hào)時(shí)，調(diào)用瀏覽器的內(nèi)核提供的預(yù)定函數(shù)接口獲取第一區(qū)域信息，第一區(qū)域信息包括第一區(qū)域的左頂點(diǎn)位置、橫向長(zhǎng)度和縱向長(zhǎng)度。
[0030]可選的，第二獲取子模塊，被配置為從渲染圖像列表中獲取與GIF圖像對(duì)應(yīng)的第二區(qū)域信息，第二區(qū)域信息包括第二區(qū)域的左頂點(diǎn)位置、橫向長(zhǎng)度和縱向長(zhǎng)度。
[0031]可選的，暫停模塊，被配置為向?yàn)g覽器的內(nèi)核提供的GIF圖像渲染組件發(fā)送第一指令，第一指令用于觸發(fā)GIF圖像渲染組件將與GIF圖像對(duì)應(yīng)的定時(shí)器暫停，定時(shí)器用于在第i次超時(shí)后觸發(fā)GIF圖像渲染組件對(duì)GIF圖像中的第k張子圖像進(jìn)行渲染，定時(shí)器在每次超時(shí)后重置，k=i mod η。
[0032]可選的，該裝置，還包括:
[0033]執(zhí)行模塊，被配置為在GIF圖像位于瀏覽器的顯示區(qū)中時(shí)，執(zhí)行對(duì)GIF圖像中的子圖像的渲染操作。
[0034]可選的，執(zhí)行模塊，被配置為向?yàn)g覽器的內(nèi)核提供的GIF圖像渲染組件發(fā)送第二指令，第二指令用于觸發(fā)GIF圖像渲染組件將與GIF圖像對(duì)應(yīng)的定時(shí)器開啟，定時(shí)器用于在第i次超時(shí)后觸發(fā)GIF圖像渲染組件對(duì)GIF圖像中的第k張子圖像進(jìn)行渲染，定時(shí)器在每次超時(shí)后重置，k=i mod η。
[0035]根據(jù)本公開實(shí)施例的第三方面，提供一種GIF圖像渲染裝置，該裝置包括:
[0036]處理器；
[0037]用于存儲(chǔ)處理器可執(zhí)行指令的存儲(chǔ)器；
[0038]其中，處理器被配置為:
[0039]檢測(cè)網(wǎng)頁中的GIF圖像是否位于瀏覽器的顯示區(qū)中；網(wǎng)頁是指被瀏覽器加載的網(wǎng)頁，GIF圖像包括η幀子圖像；
[0040]若GIF圖像位于瀏覽器的顯示區(qū)之外，則暫停對(duì)GIF圖像中的子圖像的渲染操作。
[0041]本公開的實(shí)施例提供的技術(shù)方案可以包括以下有益效果:
[0042]通過檢測(cè)網(wǎng)頁中的GIF圖像是否位于瀏覽器的顯示區(qū)中；網(wǎng)頁是指被瀏覽器加載的網(wǎng)頁，GIF圖像包括η幀子圖像;若GIF圖像位于瀏覽器的顯示區(qū)之外，則暫停對(duì)GIF圖像中的子圖像的渲染操作;解決了當(dāng)用戶滾動(dòng)網(wǎng)頁，使得GIF圖像處于瀏覽器的顯示區(qū)之外時(shí)，瀏覽器仍然對(duì)GIF圖像中的每一幀單幀圖像進(jìn)行渲染，導(dǎo)致CPU資源的大量浪費(fèi)的問題;達(dá)到了當(dāng)GIF圖像位于瀏覽器的顯示區(qū)之外時(shí)，暫停對(duì)GIF圖像中的子圖像的渲染操作，提高了瀏覽器的渲染性能，在不影響用戶體驗(yàn)的同時(shí)節(jié)省了 CPU的計(jì)算資源的效果。
[0043]應(yīng)當(dāng)理解的是，以上的一般描述和后文的細(xì)節(jié)描述僅是示例性的，并不能限制本公開。
【附圖說明】
[0044]此處的附圖被并入說明書中并構(gòu)成本說明書的一部分，示出了符合本公開的實(shí)施例，并于說明書一起用于解釋本公開的原理。
[0045]圖1是根據(jù)一示例性實(shí)施例示出的一種GIF圖像渲染方法的流程圖；
[0046]圖2Α是根據(jù)另一示例性實(shí)施例示出的一種GIF圖像渲染方法的流程圖；
[0047]圖2Β是根據(jù)一示例性實(shí)施例示出的一種第一區(qū)域和第二區(qū)域是否存在交集的示意圖；
[0048]圖3Α是根據(jù)再一示例性實(shí)施例示出的一種GIF圖像渲染方法的流程圖；
[0049]圖3Β是根據(jù)一示例性實(shí)施例示出的一種瀏覽器顯示區(qū)在網(wǎng)頁中的第二區(qū)域的示意圖；
[0050]圖3C是根據(jù)一示例性實(shí)施例示出的一種GIF圖像在網(wǎng)頁中的第一區(qū)域的示意圖；
[0051]圖3D根據(jù)一示例性實(shí)施例示出的一種第一區(qū)域和第二區(qū)域在網(wǎng)頁中的示意圖；
[0052]圖4是根據(jù)一示例性實(shí)施例示出的一種GIF圖像渲染裝置的框圖；
[0053]圖5是根據(jù)另一示例性實(shí)施例示出的一種GIF圖像渲染裝置的框圖；
[0054]圖6是根據(jù)一示例性實(shí)施例示出的一種GIF圖像渲染裝置的框圖。
【具體實(shí)施方式】
[0055]這里將詳細(xì)地對(duì)示例性實(shí)施例進(jìn)行說明，其示例表示在附圖中。下面的描述涉及附圖時(shí)，除非另有表示，不同附圖中的相同數(shù)字表示相同或相似的要素。以下示例性實(shí)施例中所描述的實(shí)施方式并不代表與本公開相一致的所有實(shí)施方式。相反，它們僅是與如所附權(quán)利要求書中所詳述的、本公開的一些方面相一致的裝置和方法的例子。
[0056]圖1是根據(jù)一示例性實(shí)施例示出的一種GIF圖像渲染方法的流程圖，如圖1所示，本實(shí)施例以該方法應(yīng)用于瀏覽器中來舉例說明。該GIF圖像渲染方法可以包括以下步驟。
[0057]在步驟101中，檢測(cè)網(wǎng)頁中的GIF圖像是否位于瀏覽器的顯示區(qū)中；網(wǎng)頁是指被瀏覽器加載的網(wǎng)頁，GIF圖像包括η幀子圖像。
[0058]GIF圖像通常包括靜態(tài)GIF圖像和動(dòng)畫GIF圖像兩種類型，本公開實(shí)施例中的GIF圖像是指動(dòng)畫GIF圖像。GIF圖像包括η幀子圖像。GIF圖像中的η幀子圖像在定時(shí)器控制下被逐幀渲染后，會(huì)產(chǎn)生動(dòng)畫效果。
[°°59]可選地，網(wǎng)頁中包括一個(gè)或一個(gè)以上的GIF圖像，每個(gè)GIF圖像中包括η幀子圖像，η為大于或者等于2的整數(shù)。
[0060]由于瀏覽器的顯示區(qū)大小的限制，使得被瀏覽器加載的網(wǎng)頁通常不能在瀏覽器的顯示區(qū)中全部呈現(xiàn)。因此，網(wǎng)頁中的GIF圖像可能位于瀏覽器的顯示區(qū)中，也可能位于瀏覽器的顯示區(qū)之外。
[0061]在步驟102中，若GIF圖像位于瀏覽器的顯示區(qū)之外，則暫停對(duì)GIF圖像中的子圖像的渲染操作。
[0062]綜上所述，本公開實(shí)施例中提供的GIF圖像渲染方法，通過檢測(cè)網(wǎng)頁中的GIF圖像是否位于瀏覽器的顯示區(qū)中；網(wǎng)頁是指被瀏覽器加載的網(wǎng)頁，GIF圖像包括η幀子圖像;若GIF圖像位于瀏覽器的顯示區(qū)之外，則暫停對(duì)GIF圖像中的子圖像的渲染操作;解決了當(dāng)用戶滾動(dòng)網(wǎng)頁，使得GIF圖像處于瀏覽器的顯示區(qū)之外時(shí)，瀏覽器仍然對(duì)GIF圖像中的每一幀單幀圖像進(jìn)行渲染，導(dǎo)致CPU資源的大量浪費(fèi)的問題;達(dá)到了當(dāng)GIF圖像位于瀏覽器的顯示區(qū)之外時(shí)，暫停對(duì)GIF圖像中的子圖像的渲染操作，提高了瀏覽器的渲染性能，在不影響用戶體驗(yàn)的同時(shí)節(jié)省了 CPU的計(jì)算資源的效果。
[0063]圖2Α是根據(jù)另一示例性實(shí)施例示出的一種GIF圖像渲染方法的流程圖，如圖2Α所示，本實(shí)施例以該方法應(yīng)用于瀏覽器中來舉例說明。該GIF圖像渲染方法可以包括以下步驟。
[0064]在步驟201中，獲取第一區(qū)域信息，第一區(qū)域信息用于指示瀏覽器的顯示區(qū)在網(wǎng)頁中對(duì)應(yīng)的第一區(qū)域。
[0065]由于瀏覽器的顯示區(qū)大小的限制，使得被瀏覽器加載的網(wǎng)頁通常不能在瀏覽器的顯示區(qū)中全部呈現(xiàn)。用戶為了查看被瀏覽器加載的網(wǎng)頁中的不同區(qū)域的網(wǎng)頁內(nèi)容，一般通過上下左右移動(dòng)網(wǎng)頁，改變?yōu)g覽器的顯示區(qū)在網(wǎng)頁中所對(duì)應(yīng)的第一區(qū)域，從而在瀏覽器的顯示區(qū)中查看到網(wǎng)頁中不同區(qū)域的網(wǎng)頁內(nèi)容。
[0066]可選的，在將網(wǎng)頁向上移動(dòng)時(shí)相當(dāng)于將瀏覽器的顯示區(qū)向下移動(dòng)。
[0067]當(dāng)網(wǎng)頁被瀏覽器加載后，獲取用于指示瀏覽器的顯示區(qū)在網(wǎng)頁中對(duì)應(yīng)的第一區(qū)域的第一區(qū)域信息。
[0068]可選的，瀏覽器的顯示區(qū)對(duì)應(yīng)的第一區(qū)域通常為矩形區(qū)域。
[0069]在步驟202中，獲取第二區(qū)域信息，第二區(qū)域信息用于指示GIF圖像在網(wǎng)頁中對(duì)應(yīng)的第二區(qū)域。
[0070]瀏覽器在獲取到第一區(qū)域信息后，獲取用于指示GIF圖像在網(wǎng)頁中對(duì)應(yīng)的第二區(qū)域的第二區(qū)域信息。
[0071]網(wǎng)頁中包括一個(gè)或一個(gè)以上的GIF圖像，瀏覽器獲取網(wǎng)頁中每個(gè)GIF圖像在網(wǎng)頁中的第二區(qū)域信息。
[0072]可選的，GIF圖像對(duì)應(yīng)的第二區(qū)域通常為矩形區(qū)域。
[0073]在步驟203中，根據(jù)第一區(qū)域信息和第二區(qū)域信息，檢測(cè)第一區(qū)域和第二區(qū)域是否存在交集。
[0074]交集用于表示GIF圖像位于瀏覽器的顯示區(qū)中。
[0075]瀏覽器在獲取到第一區(qū)域信息和第二區(qū)域信息后，獲取第一區(qū)域信息對(duì)應(yīng)的第一區(qū)域，獲取第二區(qū)域信息對(duì)應(yīng)的第二區(qū)域，在讀取到第一區(qū)域和第二區(qū)域后，通過矩形求交算法檢測(cè)獲取到的第一區(qū)域和第二區(qū)域是否存在交集。
[0076]在步驟203的檢測(cè)過程中會(huì)出現(xiàn)兩種檢測(cè)結(jié)果，當(dāng)?shù)谝粎^(qū)域和第二區(qū)域不存在交集時(shí)，執(zhí)行步驟204;當(dāng)?shù)谝粎^(qū)域和第二區(qū)域存在交集時(shí)，執(zhí)行步驟205。
[0077]在步驟204中，若第一區(qū)域和第二區(qū)域不存在交集時(shí)，則暫停對(duì)GIF圖像中的子圖像的渲染操作。
[0078]當(dāng)?shù)谝粎^(qū)域和第二區(qū)域不存在交集時(shí)，說明第二區(qū)域?qū)?yīng)的GIF圖像位于第一區(qū)域?qū)?yīng)的瀏覽器的顯示區(qū)之外，則暫停對(duì)GIF圖像中的子圖像的渲染操作。
[0079]在步驟205中，若第一區(qū)域和第二區(qū)域存在交集時(shí)，則執(zhí)行對(duì)GIF圖像中的子圖像的渲染操作。
[0080]當(dāng)?shù)谝粎^(qū)域和第二區(qū)域存在交集時(shí)，說明第二區(qū)域?qū)?yīng)的GIF圖像位于第一區(qū)域?qū)?yīng)的瀏覽器的顯示區(qū)中，則執(zhí)行對(duì)GIF圖像中的子圖像的渲染操作。
[0081]在一個(gè)具體的例子中，如圖2B所示，以網(wǎng)頁21被瀏覽器加載為例，當(dāng)網(wǎng)頁21被瀏覽器初始加載后，瀏覽器的顯示區(qū)的左頂點(diǎn)位于網(wǎng)頁21的左頂點(diǎn)處，獲取瀏覽器的顯示區(qū)在網(wǎng)頁21中對(duì)應(yīng)的第一區(qū)域22;獲取GIF圖像在網(wǎng)頁21中對(duì)應(yīng)的第二區(qū)域23;在獲取到第一區(qū)域22和第二區(qū)域23后，檢測(cè)第一區(qū)域22對(duì)應(yīng)的矩形和第二區(qū)域23對(duì)應(yīng)的矩形是否存在交集；如圖2B所示，第一區(qū)域22對(duì)應(yīng)的矩形和第二區(qū)域23對(duì)應(yīng)的矩形之間不存在交集，說明GIF圖像位于瀏覽器的顯示區(qū)之外，則暫停對(duì)網(wǎng)頁21中第一區(qū)域?qū)?yīng)的GIF圖像中的子圖像的渲染操作。
[0082]綜上所述，本公開實(shí)施例中提供的GIF圖像渲染方法，通過獲取第一區(qū)域信息；獲取第二區(qū)域信息;根據(jù)第一區(qū)域信息和第二區(qū)域信息，檢測(cè)第一區(qū)域和第二區(qū)域是否存在交集;若第一區(qū)域和第二區(qū)域不存在交集時(shí)，則暫停對(duì)GIF圖像中的子圖像的渲染操作;解決了當(dāng)用戶滾動(dòng)網(wǎng)頁，使得GIF圖像處于瀏覽器的顯示區(qū)之外時(shí)，瀏覽器仍然對(duì)GIF圖像中的每一幀單幀圖像進(jìn)行渲染，導(dǎo)致CPU資源的大量浪費(fèi)的問題;達(dá)到了當(dāng)GIF圖像位于瀏覽器的顯示區(qū)之外時(shí)，暫停對(duì)GIF圖像中的子圖像的渲染操作，提高了瀏覽器的渲染性能，在不影響用戶體驗(yàn)的同時(shí)節(jié)省了 CPU的計(jì)算資源的效果。
[0083]圖3A是根據(jù)再一示例性實(shí)施例示出的一種GIF圖像渲染方法的流程圖，如圖3A所示，本實(shí)施例以該方法應(yīng)用于瀏覽器中來舉例說明。該GIF圖像渲染方法可以包括以下步驟。
[0084]在步驟301中，在網(wǎng)頁被加載后或者接收到移動(dòng)信號(hào)時(shí)，調(diào)用瀏覽器的內(nèi)核提供的預(yù)定函數(shù)接口獲取第一區(qū)域信息，第一區(qū)域信息包括第一區(qū)域的左頂點(diǎn)位置、橫向長(zhǎng)度和縱向長(zhǎng)度。
[0085]其中，第一區(qū)域信息由瀏覽器的內(nèi)核進(jìn)行維護(hù)。
[0086]移動(dòng)信號(hào)包括瀏覽器中接收到的用于滾動(dòng)網(wǎng)頁的信號(hào)。比如:向上滾動(dòng)網(wǎng)頁、向下滾動(dòng)網(wǎng)頁、向左移動(dòng)網(wǎng)頁或者向右移動(dòng)網(wǎng)頁等。
[0087]在網(wǎng)頁被加載后或者接收到移動(dòng)信號(hào)后，瀏覽器的內(nèi)核對(duì)瀏覽器的顯示區(qū)在網(wǎng)頁中對(duì)應(yīng)的第一區(qū)域信息進(jìn)行維護(hù)，確定出瀏覽器的顯示區(qū)在網(wǎng)頁中對(duì)應(yīng)的第一區(qū)域信息。
[0088]瀏覽器通過調(diào)用瀏覽器的內(nèi)核提供的預(yù)定函數(shù)接口獲取由瀏覽器的內(nèi)核維護(hù)的第一區(qū)域信息，其中，預(yù)定函數(shù)接口可以為與Viewport相關(guān)的函數(shù)接口。
[0089]第一區(qū)域信息包括:第一區(qū)域的左頂點(diǎn)位置、橫向長(zhǎng)度和縱向長(zhǎng)度。也即，第一區(qū)域信息包括第一區(qū)域的左頂點(diǎn)位置和大小。
[0090]比如:如圖3B所示，以網(wǎng)頁31的左頂點(diǎn)為原點(diǎn)，以網(wǎng)頁31的橫向長(zhǎng)度為橫坐標(biāo)，以網(wǎng)頁31的縱向長(zhǎng)度為縱坐標(biāo)建立坐標(biāo)軸;假定網(wǎng)頁31的橫向長(zhǎng)度為20，縱向長(zhǎng)度為50，瀏覽器的顯示區(qū)域的橫向長(zhǎng)度為15，縱向長(zhǎng)度為20;當(dāng)網(wǎng)頁31被加載后，瀏覽器的內(nèi)核默認(rèn)的瀏覽器的顯示區(qū)在網(wǎng)頁31中對(duì)應(yīng)的第一區(qū)域32的左頂點(diǎn)的坐標(biāo)為(0，0)，則根據(jù)左頂點(diǎn)坐標(biāo)(0，0)、瀏覽器的顯示區(qū)域的橫向長(zhǎng)度為15和縱向長(zhǎng)度為20，確定第一區(qū)域信息。又比如:當(dāng)瀏覽器接收到向下移動(dòng)信號(hào)時(shí)，瀏覽器的內(nèi)核根據(jù)向下移動(dòng)信號(hào)確定出第一區(qū)域信息，如圖3B所示，假定接收到向下移動(dòng)10格，則瀏覽器的內(nèi)核確定出瀏覽器的顯示區(qū)在網(wǎng)頁31中對(duì)應(yīng)的第一區(qū)域32的左頂點(diǎn)的坐標(biāo)為(10，0)，則根據(jù)左頂點(diǎn)坐標(biāo)(10，0)、瀏覽器的顯示區(qū)域的橫向長(zhǎng)度為15和縱向長(zhǎng)度為20，確定第一區(qū)域信息。
[0091]可選的，第一區(qū)域信息可以包括:第一區(qū)域的左頂點(diǎn)位置、右頂點(diǎn)位置、左下頂點(diǎn)位置和右下頂點(diǎn)位置。
[0092]在步驟302中，從渲染圖像列表中獲取與GIF圖像對(duì)應(yīng)的第二區(qū)域信息，第二區(qū)域信息包括第二區(qū)域的左頂點(diǎn)位置、橫向長(zhǎng)度和縱向長(zhǎng)度。
[0093]渲染圖像列表是指網(wǎng)頁中GIF圖像對(duì)應(yīng)的第二區(qū)域信息的列表，也即，渲染圖像列表中存儲(chǔ)有網(wǎng)頁中的GIF圖像與對(duì)應(yīng)的第二區(qū)域信息之間的對(duì)應(yīng)關(guān)系。
[0094]可選的，瀏覽器通過調(diào)用renderView函數(shù)從render image list中獲取與GIF圖像對(duì)應(yīng)的第二區(qū)域信息。其中，:render image list為清染圖像列表。
[0095]第二區(qū)域信息包括:第二區(qū)域的左頂點(diǎn)位置、橫向長(zhǎng)度和縱向長(zhǎng)度。也即，第二區(qū)域信息包括第二區(qū)域的左頂點(diǎn)位置和大小。
[0096]比如:如圖3C所示，以網(wǎng)頁35的左頂點(diǎn)為原點(diǎn)，以網(wǎng)頁35的橫向長(zhǎng)度為橫坐標(biāo)，以網(wǎng)頁35的縱向長(zhǎng)度為縱坐標(biāo)建立坐標(biāo)軸;獲取GIF圖像的左頂點(diǎn)坐標(biāo)在網(wǎng)頁35中的位置，根據(jù)GIF圖像的左頂點(diǎn)坐標(biāo)、GIF圖像的橫向長(zhǎng)度和縱向長(zhǎng)度確定出第二區(qū)域信息。假定網(wǎng)頁31的橫向長(zhǎng)度為20，縱向長(zhǎng)度為50，GIF圖像的左頂點(diǎn)坐標(biāo)為(5，10)、GIF圖像的橫向長(zhǎng)度為
1、縱向長(zhǎng)度也為1，則獲取得到的第二區(qū)域36的左頂點(diǎn)坐標(biāo)為(5，1 )、橫向長(zhǎng)度為1、縱向長(zhǎng)度也為10的區(qū)域。
[0097]可選的，第二區(qū)域信息可以包括:第二區(qū)域的左頂點(diǎn)位置、右頂點(diǎn)位置、左下頂點(diǎn)位置和右下頂點(diǎn)位置。
[0098]在步驟303中，根據(jù)第一區(qū)域信息和第二區(qū)域信息，檢測(cè)第一區(qū)域和第二區(qū)域是否存在交集。
[0099]交集用于表示GIF圖像位于瀏覽器的顯示區(qū)中。
[0100]瀏覽器在獲取到第一區(qū)域信息和第二區(qū)域信息后，讀取第一區(qū)域信息對(duì)應(yīng)的第一區(qū)域，讀取第二區(qū)域信息對(duì)應(yīng)的第二區(qū)域，在讀取到第一區(qū)域和第二區(qū)域后，檢測(cè)讀取到的第一區(qū)域和第二區(qū)域是否存在交集。
[0101]可選的，瀏覽器調(diào)用rect.1ntersects函數(shù)檢測(cè)第一區(qū)域?qū)?yīng)的矩形與第二區(qū)域?qū)?yīng)的矩形之間是否存在交集。
[0102]比如:如圖3D所示，由圖3B中確定的第一區(qū)域信息可知，第一區(qū)域38的左頂點(diǎn)坐標(biāo)為(10，0)、右頂點(diǎn)坐標(biāo)為(10，15)、左下頂點(diǎn)坐標(biāo)為(30，0)和右下頂點(diǎn)坐標(biāo)為(30，15);由圖3C中獲取到的第二區(qū)域信息可知，第二區(qū)域39的左頂點(diǎn)坐標(biāo)為(5，1)、右頂點(diǎn)坐標(biāo)為(I 5，10)、左下頂點(diǎn)坐標(biāo)為(5，20)和右下頂點(diǎn)坐標(biāo)為(15，20)。從圖3D中可以看出，圖3B中確定的第一區(qū)域38與圖3C中獲取的第二區(qū)域39之間存在交集。若第二區(qū)域40的左頂點(diǎn)坐標(biāo)為(5，40)、右頂點(diǎn)坐標(biāo)為(15，40)、左下頂點(diǎn)坐標(biāo)為(5，50)和右下頂點(diǎn)坐標(biāo)為(15，50)。從圖3D中可以看出，圖3B中確定的第一區(qū)域38與第二區(qū)域40之間不存在交集。
[0103]在步驟303的檢測(cè)過程中會(huì)出現(xiàn)兩種檢測(cè)結(jié)果，當(dāng)?shù)谝粎^(qū)域和第二區(qū)域不存在交集時(shí)，執(zhí)行步驟304;當(dāng)?shù)谝粎^(qū)域和第二區(qū)域存在交集時(shí)，執(zhí)行步驟305。
[0104]在步驟304中，若第一區(qū)域和第二區(qū)域不存在交集時(shí)，則向?yàn)g覽器的內(nèi)核提供的GIF圖像渲染組件發(fā)送第一指令，第一指令用于觸發(fā)GIF圖像渲染組件將與GIF圖像對(duì)應(yīng)的定時(shí)器暫停，定時(shí)器用于在第i次超時(shí)后觸發(fā)GIF圖像渲染組件對(duì)GIF圖像中的第k張子圖像進(jìn)行清染，定時(shí)器在每次超時(shí)后重置，k=i mod η。
[0105]當(dāng)?shù)谝粎^(qū)域和第二區(qū)域不存在交集時(shí)，說明第二區(qū)域?qū)?yīng)的GIF圖像位于第一區(qū)域?qū)?yīng)的瀏覽器的顯示區(qū)之外，則向?yàn)g覽器的內(nèi)核提供的GIF圖像渲染組件發(fā)送第一指令，GIF圖像渲染組件根據(jù)接收到的第一指令將與GIF圖像對(duì)應(yīng)的定時(shí)器暫停。也即，停止對(duì)GIF圖像中的子圖像的渲染操作。
[0106]GIF圖像渲染組件用于根據(jù)接收到的指令控制GIF圖像對(duì)應(yīng)的定時(shí)器的開啟和暫停。每個(gè)GIF圖像都對(duì)應(yīng)一個(gè)定時(shí)器和一個(gè)寄存器，定時(shí)器用于在第i次超時(shí)后觸發(fā)GIF圖像渲染組件對(duì)GIF圖像中的第k張子圖像進(jìn)行渲染，且定時(shí)器在每次超時(shí)后都進(jìn)行重置。寄存器用于在定時(shí)器超時(shí)后，保存最新的k值?？蛇x地，當(dāng)定時(shí)器每次超時(shí)時(shí)，GIF圖像渲染組件先將寄存器中的k值加一，然后對(duì)η取余，將取余結(jié)果重新寫入寄存器。寄存器中的k值用于指示GIF圖像渲染組件需要對(duì)GIF圖像中的第k幀子圖像進(jìn)行渲染，η為GIF圖像中的子圖像總數(shù)。
[0107]GIF圖像渲染組件在接收到第一指令后，對(duì)該GIF圖像對(duì)應(yīng)的寄存器中的k值進(jìn)行清空，或者，對(duì)該GIF圖像對(duì)應(yīng)的寄存器中的k值繼續(xù)緩存。
[0108]在步驟305中，若第一區(qū)域和第二區(qū)域存在交集時(shí)，則向?yàn)g覽器的內(nèi)核提供的GIF圖像渲染組件發(fā)送第二指令，第二指令用于觸發(fā)GIF圖像渲染組件將與GIF圖像對(duì)應(yīng)的定時(shí)器開啟，定時(shí)器用于在第i次超時(shí)后觸發(fā)GIF圖像渲染組件對(duì)GIF圖像中的第k張子圖像進(jìn)行渲染，定時(shí)器在每次超時(shí)后重置，k=i modno
[0109]當(dāng)?shù)谝粎^(qū)域和第二區(qū)域存在交集時(shí)，說明第二區(qū)域?qū)?yīng)的GIF圖像位于第一區(qū)域?qū)?yīng)的瀏覽器的顯示區(qū)中，則向?yàn)g覽器的內(nèi)核提供的GIF圖像渲染組件發(fā)送第二指令，GIF圖像渲染組件根據(jù)接收到的第二指令將與GIF圖像對(duì)應(yīng)的定時(shí)器開啟。也即，執(zhí)行對(duì)GIF圖像中的子圖像的渲染操作。
[0110]可選的，當(dāng)GIF圖像渲染組件接收到第二指令后，如果與該GIF圖像對(duì)應(yīng)的寄存器中的k值為空，則GIF圖像渲染組件從GIF圖像中的第I幀子圖像開始渲染;如果與該GIF圖像對(duì)應(yīng)的寄存器中的k值緩存有暫停時(shí)的k值，則GIF圖像渲染組件從GIF圖像中的第k幀子圖像開始渲染。
[0111]比如:若GIF圖像在瀏覽器的移動(dòng)過程中，一開始位于瀏覽器的顯示區(qū)中，則GIF圖像渲染組件接收第一指令對(duì)GIF圖像中的子圖像進(jìn)行渲染操作，當(dāng)渲染到第3張子圖像時(shí)，GIF圖像位于瀏覽器的顯示區(qū)之外了，則GIF圖像渲染組件接收第二指令暫停對(duì)GIF圖像中第4張子圖像的渲染，一段時(shí)間后，GIF圖像又再次位于瀏覽器的顯示區(qū)中，則GIF圖像渲染組件再次接收第一指令，對(duì)GIF圖像中的子圖像進(jìn)行渲染，此時(shí)，GIF圖像渲染組件可以對(duì)GIF圖像中的第I張子圖像開始進(jìn)行渲染，也可以從GIF圖像中的第4張子圖像繼續(xù)進(jìn)行渲染。
[0112]綜上所述，本公開實(shí)施例中提供的GIF圖像渲染方法，通過在網(wǎng)頁被加載后或者接收到移動(dòng)信號(hào)時(shí)，調(diào)用瀏覽器的內(nèi)核提供的預(yù)定函數(shù)接口獲取第一區(qū)域信息;從渲染圖像列表中獲取與GIF圖像對(duì)應(yīng)的第二區(qū)域信息;根據(jù)第一區(qū)域信息和第二區(qū)域信息，檢測(cè)第一區(qū)域和第二區(qū)域是否存在交集;若第一區(qū)域和第二區(qū)域不存在交集時(shí)，則暫停對(duì)GIF圖像中的子圖像的渲染操作;解決了當(dāng)用戶滾動(dòng)網(wǎng)頁，使得GIF圖像處于瀏覽器的顯示區(qū)之外時(shí)，瀏覽器仍然對(duì)GIF圖像中的每一幀單幀圖像進(jìn)行渲染，導(dǎo)致CPU資源的大量浪費(fèi)的問題;達(dá)到了當(dāng)GIF圖像位于瀏覽器的顯示區(qū)之外時(shí)，暫停對(duì)GIF圖像中的子圖像的渲染操作，提高了瀏覽器的渲染性能，在不影響用戶體驗(yàn)的同時(shí)節(jié)省了 CPU的計(jì)算資源的效果。
[0113]另外，通過GIF圖像渲染組件控制GIF圖像對(duì)應(yīng)的定時(shí)器的開啟和暫停，可以實(shí)現(xiàn)在GIF圖像再次位于瀏覽器的顯示區(qū)時(shí)，從GIF圖像中的第k張圖像進(jìn)行渲染操作的效果。
[0114]下述為本公開裝置實(shí)施例，可以用于執(zhí)行本公開方法實(shí)施例。對(duì)于本公開裝置實(shí)施例中未披露的細(xì)節(jié)，請(qǐng)參照本公開方法實(shí)施例。
[0115]圖4是根據(jù)一示例性實(shí)施例示出的一種GIF圖像渲染裝置的框圖，如圖4所示，該GIF圖像渲染裝置包括但不限于:
[0116]檢測(cè)模塊420，被配置為檢測(cè)網(wǎng)頁中的GIF圖像是否位于瀏覽器的顯示區(qū)中；網(wǎng)頁是指被瀏覽器加載的網(wǎng)頁，GIF圖像包括η幀子圖像。
[0117]GIF圖像通常包括靜態(tài)GIF圖像和動(dòng)畫GIF圖像兩種類型，本公開實(shí)施例中的GIF圖像是指動(dòng)畫GIF圖像。GIF圖像包括η幀子圖像。GIF圖像中的η幀子圖像在定時(shí)器控制下被逐幀渲染后，會(huì)產(chǎn)生動(dòng)畫效果。
[0118]可選地，網(wǎng)頁中包括一個(gè)或一個(gè)以上的GIF圖像，每個(gè)GIF圖像中包括η幀子圖像，η為大于或者等于2的整數(shù)。
[0119]由于瀏覽器的顯示區(qū)大小的限制，使得被瀏覽器加載的網(wǎng)頁通常不能在瀏覽器的顯示區(qū)中全部呈現(xiàn)。因此，網(wǎng)頁中的GIF圖像可能位于瀏覽器的顯示區(qū)中，也可能位于瀏覽器的顯示區(qū)之外。
[0120]暫停模塊440，被配置為在GIF圖像位于瀏覽器的顯示區(qū)之外時(shí)，暫停對(duì)GIF圖像中的子圖像的渲染操作。
[0121]綜上所述，本公開實(shí)施例中提供的GIF圖像渲染裝置，通過檢測(cè)網(wǎng)頁中的GIF圖像是否位于瀏覽器的顯示區(qū)中；網(wǎng)頁是指被瀏覽器加載的網(wǎng)頁，GIF圖像包括η幀子圖像;若GIF圖像位于瀏覽器的顯示區(qū)之外，則暫停對(duì)GIF圖像中的子圖像的渲染操作;解決了當(dāng)用戶滾動(dòng)網(wǎng)頁，使得GIF圖像處于瀏覽器的顯示區(qū)之外時(shí)，瀏覽器仍然對(duì)GIF圖像中的每一幀單幀圖像進(jìn)行渲染，導(dǎo)致CPU資源的大量浪費(fèi)的問題;達(dá)到了當(dāng)GIF圖像位于瀏覽器的顯示區(qū)之外時(shí)，暫停對(duì)GIF圖像中的子圖像的渲染操作，提高了瀏覽器的渲染性能，在不影響用戶體驗(yàn)的同時(shí)節(jié)省了 CPU的計(jì)算資源的效果。
[0122]圖5是根據(jù)一示例性實(shí)施例示出的一種GIF圖像渲染裝置的框圖，如圖5所示，該GIF圖像渲染裝置包括但不限于:
[0123]檢測(cè)模塊420，被配置為檢測(cè)網(wǎng)頁中的GIF圖像是否位于瀏覽器的顯示區(qū)中；網(wǎng)頁是指被瀏覽器加載的網(wǎng)頁，GIF圖像包括η幀子圖像。
[0124]可選的，檢測(cè)模塊420可以包括:
[0125]第一獲取子模塊421，被配置為獲取第一區(qū)域信息，第一區(qū)域信息用于指示瀏覽器的顯示區(qū)在網(wǎng)頁中對(duì)應(yīng)的第一區(qū)域。
[0126]由于瀏覽器的顯示區(qū)大小的限制，使得被瀏覽器加載的網(wǎng)頁通常不能在瀏覽器的顯示區(qū)中全部呈現(xiàn)。用戶為了查看被瀏覽器加載的網(wǎng)頁中的不同區(qū)域的網(wǎng)頁內(nèi)容，一般通過上下左右移動(dòng)網(wǎng)頁，改變?yōu)g覽器的顯示區(qū)在網(wǎng)頁中所對(duì)應(yīng)的第一區(qū)域，從而在瀏覽器的顯示區(qū)中查看到網(wǎng)頁中不同區(qū)域的網(wǎng)頁內(nèi)容。
[0127]可選的，在將網(wǎng)頁向上移動(dòng)時(shí)相當(dāng)于將瀏覽器的顯示區(qū)向下移動(dòng)。
[0128]當(dāng)網(wǎng)頁被瀏覽器加載后，獲取用于指示瀏覽器的顯示區(qū)在網(wǎng)頁中對(duì)應(yīng)的第一區(qū)域的第一區(qū)域信息。
[0129]可選的，瀏覽器的顯示區(qū)對(duì)應(yīng)的第一區(qū)域通常為矩形區(qū)域。
[0130]可選的，第一獲取子模塊421，被配置為在網(wǎng)頁被加載后或者接收到移動(dòng)信號(hào)時(shí)，調(diào)用瀏覽器的內(nèi)核提供的預(yù)定函數(shù)接口獲取第一區(qū)域信息，第一區(qū)域信息包括第一區(qū)域的左頂點(diǎn)位置、橫向長(zhǎng)度和縱向長(zhǎng)度。
[0131]其中，第一區(qū)域信息由瀏覽器的內(nèi)核進(jìn)行維護(hù)。
[0132]移動(dòng)信號(hào)包括瀏覽器滾動(dòng)網(wǎng)頁的信號(hào)。比如:向上滾動(dòng)網(wǎng)頁、向下滾動(dòng)網(wǎng)頁、向左移動(dòng)網(wǎng)頁或者向右移動(dòng)網(wǎng)頁等。
[0133]在網(wǎng)頁被加載后或者接收到移動(dòng)信號(hào)后，瀏覽器的內(nèi)核對(duì)瀏覽器的顯示區(qū)在網(wǎng)頁中對(duì)應(yīng)的第一區(qū)域信息進(jìn)行維護(hù)，確定出瀏覽器的顯示區(qū)在網(wǎng)頁中對(duì)應(yīng)的第一區(qū)域信息。
[0134]瀏覽器通過調(diào)用瀏覽器的內(nèi)核提供的預(yù)定函數(shù)接口獲取由瀏覽器的內(nèi)核維護(hù)的第一區(qū)域信息，其中，預(yù)定函數(shù)接口可以為Viewport函數(shù)接口。
[0135]第一區(qū)域信息包括:第一區(qū)域的左頂點(diǎn)位置、橫向長(zhǎng)度和縱向長(zhǎng)度。也即，第一區(qū)域信息包括第一區(qū)域的左頂點(diǎn)位置和大小。
[0136]可選的，第一區(qū)域信息可以包括:第一區(qū)域的左頂點(diǎn)位置、右頂點(diǎn)位置、左下頂點(diǎn)位置和右下頂點(diǎn)位置。
[0137]第二獲取子模塊422，被配置為獲取第二區(qū)域信息，第二區(qū)域信息用于指示GIF圖像在網(wǎng)頁中對(duì)應(yīng)的第二區(qū)域。
[0138]瀏覽器在獲取到第一區(qū)域信息后，獲取用于指示GIF圖像在網(wǎng)頁中對(duì)應(yīng)的第二區(qū)域的第二區(qū)域信息。
[0139]網(wǎng)頁中包括一個(gè)或一個(gè)以上的GIF圖像，瀏覽器獲取網(wǎng)頁中每個(gè)GIF圖像在網(wǎng)頁中的第二區(qū)域信息。
[0140]可選的，GIF圖像對(duì)應(yīng)的第二區(qū)域通常為矩形區(qū)域。
[0141]可選的，第二獲取子模塊422，被配置為從渲染圖像列表中獲取與GIF圖像對(duì)應(yīng)的第二區(qū)域信息，第二區(qū)域信息包括第二區(qū)域的左頂點(diǎn)位置、橫向長(zhǎng)度和縱向長(zhǎng)度。
[0142]渲染圖像列表是指網(wǎng)頁中GIF圖像對(duì)應(yīng)的第二區(qū)域信息的列表，也即，渲染圖像列表中存儲(chǔ)有網(wǎng)頁中的GIF圖像與對(duì)應(yīng)的第二區(qū)域信息之間的對(duì)應(yīng)關(guān)系。
[0143]可選的，瀏覽器通過調(diào)用renderView函數(shù)從render image list中獲取與GIF圖像對(duì)應(yīng)的第二區(qū)域信息。其中，:render image list為清染圖像列表。
[0144]第二區(qū)域信息包括:第二區(qū)域的左頂點(diǎn)位置、橫向長(zhǎng)度和縱向長(zhǎng)度。也即，第二區(qū)域信息包括第二區(qū)域的左頂點(diǎn)位置和大小。
[0145]可選的，第二區(qū)域信息可以包括:第二區(qū)域的左頂點(diǎn)位置、右頂點(diǎn)位置、左下頂點(diǎn)位置和右下頂點(diǎn)位置。
[0146]交集檢測(cè)子模塊423，被配置為根據(jù)第一區(qū)域信息和第二區(qū)域信息，檢測(cè)第一區(qū)域和第二區(qū)域是否存在交集，交集用于表示GIF圖像位于瀏覽器的顯示區(qū)中。
[0147]瀏覽器在獲取到第一區(qū)域信息和第二區(qū)域信息后，讀取第一區(qū)域信息對(duì)應(yīng)的第一區(qū)域，讀取第二區(qū)域信息對(duì)應(yīng)的第二區(qū)域，在讀取到第一區(qū)域和第二區(qū)域后，檢測(cè)讀取到的第一區(qū)域和第二區(qū)域是否存在交集。
[0148]可選的，瀏覽器調(diào)用rect.1ntersects函數(shù)檢測(cè)第一區(qū)域?qū)?yīng)的矩形與第二區(qū)域?qū)?yīng)的矩形之間是否存在交集。
[0149]暫停模塊440，被配置為在GIF圖像位于瀏覽器的顯示區(qū)之外時(shí)，暫停對(duì)GIF圖像中的子圖像的渲染操作。
[0150]當(dāng)?shù)谝粎^(qū)域和第二區(qū)域不存在交集時(shí)，說明第二區(qū)域?qū)?yīng)的GIF圖像位于第一區(qū)域?qū)?yīng)的瀏覽器的顯示區(qū)之外，則暫停對(duì)GIF圖像中的子圖像的渲染操作。
[0151]可選的，暫停模塊440，被配置為向?yàn)g覽器的內(nèi)核提供的GIF圖像渲染組件發(fā)送第一指令，第一指令用于觸發(fā)GIF圖像渲染組件將與GIF圖像對(duì)應(yīng)的定時(shí)器暫停，定時(shí)器用于在第i次超時(shí)后觸發(fā)GIF圖像渲染組件對(duì)GIF圖像中的第k張子圖像進(jìn)行渲染，定時(shí)器在每次超時(shí)后重置，k=i mod η。
[0152]當(dāng)?shù)谝粎^(qū)域和第二區(qū)域不存在交集時(shí)，說明第二區(qū)域?qū)?yīng)的GIF圖像位于第一區(qū)域?qū)?yīng)的瀏覽器的顯示區(qū)之外，則向?yàn)g覽器的內(nèi)核提供的GIF圖像渲染組件發(fā)送第一指令，GIF圖像渲染組件根據(jù)接收到的第一指令將與GIF圖像對(duì)應(yīng)的定時(shí)器暫停。也即，停止對(duì)GIF圖像中的子圖像的渲染操作。
[0153]GIF圖像渲染組件用于根據(jù)接收到的指令控制GIF圖像對(duì)應(yīng)的定時(shí)器的開啟和暫停。每個(gè)GIF圖像都對(duì)應(yīng)一個(gè)定時(shí)器和一個(gè)寄存器，定時(shí)器用于在第i次超時(shí)后觸發(fā)GIF圖像渲染組件對(duì)GIF圖像中的第k張子圖像進(jìn)行渲染，且定時(shí)器在每次超時(shí)后都進(jìn)行重置。寄存器用于在定時(shí)器超時(shí)后，保存最新的k值?？蛇x地，當(dāng)定時(shí)器每次超時(shí)時(shí)，GIF圖像渲染組件先將寄存器中的k值加一，然后對(duì)η取余，將取余結(jié)果重新寫入寄存器。寄存器中的k值用于指示GIF圖像渲染組件需要對(duì)GIF圖像中的第k幀子圖像進(jìn)行渲染，η為GIF圖像中的子圖像總數(shù)。
[0154]GIF圖像渲染組件在接收到第一指令后，對(duì)該GIF圖像對(duì)應(yīng)的寄存器中的k值進(jìn)行清空，或者，對(duì)該GIF圖像對(duì)應(yīng)的寄存器中的k值繼續(xù)緩存。
[0155]可選的，該裝置還可以包括:
[0156]執(zhí)行模塊460，被配置為在GIF圖像位于瀏覽器的顯示區(qū)中時(shí)，執(zhí)行對(duì)GIF圖像中的子圖像的渲染操作。
[0157]當(dāng)?shù)谝粎^(qū)域和第二區(qū)域存在交集時(shí)，說明第二區(qū)域?qū)?yīng)的GIF圖像位于第一區(qū)域?qū)?yīng)的瀏覽器的顯示區(qū)中，則執(zhí)行對(duì)GIF圖像中的子圖像的渲染操作。
[0158]可選的，執(zhí)行模塊460，被配置為向?yàn)g覽器的內(nèi)核提供的GIF圖像渲染組件發(fā)送第二指令，第二指令用于觸發(fā)GIF圖像渲染組件將與GIF圖像對(duì)應(yīng)的定時(shí)器開啟，定時(shí)器用于在第i次超時(shí)后觸發(fā)GIF圖像渲染組件對(duì)GIF圖像中的第k張子圖像進(jìn)行渲染，定時(shí)器在每次超時(shí)后重置，k=i mod η。
[0159]當(dāng)?shù)谝粎^(qū)域和第二區(qū)域存在交集時(shí)，說明第二區(qū)域?qū)?yīng)的GIF圖像位于第一區(qū)域?qū)?yīng)的瀏覽器的顯示區(qū)中，則向?yàn)g覽器的內(nèi)核提供的GIF圖像渲染組件發(fā)送第二指令，GIF圖像渲染組件根據(jù)接收到的第二指令將與GIF圖像對(duì)應(yīng)的定時(shí)器開啟。也即，執(zhí)行對(duì)GIF圖像中的子圖像的渲染操作。
[0160]可選的，當(dāng)GIF圖像渲染組件接收到第二指令后，如果與該GIF圖像對(duì)應(yīng)的寄存器中的k值為空，則GIF圖像渲染組件從GIF圖像中的第I幀子圖像開始渲染;如果與該GIF圖像對(duì)應(yīng)的寄存器中的k值緩存有暫停時(shí)的k值，則GIF圖像渲染組件從GIF圖像中的第k幀子圖像開始渲染。
[0161]綜上所述，本公開實(shí)施例中提供的GIF圖像渲染裝置，通過獲取第一區(qū)域信息；獲取第二區(qū)域信息;根據(jù)第一區(qū)域信息和第二區(qū)域信息，檢測(cè)第一區(qū)域和第二區(qū)域是否存在交集;若第一區(qū)域和第二區(qū)域不存在交集時(shí)，則暫停對(duì)GIF圖像中的子圖像的渲染操作;解決了當(dāng)用戶滾動(dòng)網(wǎng)頁，使得GIF圖像處于瀏覽器的顯示區(qū)之外時(shí)，瀏覽器仍然對(duì)GIF圖像中的每一幀單幀圖像進(jìn)行渲染，導(dǎo)致CPU資源的大量浪費(fèi)的問題;達(dá)到了當(dāng)GIF圖像位于瀏覽器的顯示區(qū)之外時(shí)，暫停對(duì)GIF圖像中的子圖像的渲染操作，提高了瀏覽器的渲染性能，在不影響用戶體驗(yàn)的同時(shí)節(jié)省了 CPU的計(jì)算資源的效果。
[0162]另外，通過GIF圖像渲染組件控制GIF圖像對(duì)應(yīng)的定時(shí)器的開啟和暫停，可以實(shí)現(xiàn)在GIF圖像再次位于瀏覽器的顯示區(qū)時(shí)，從GIF圖像中的第k張圖像進(jìn)行渲染操作的效果。
[0163]關(guān)于上述實(shí)施例中的裝置，其中各個(gè)模塊執(zhí)行操作的具體方式已經(jīng)在有關(guān)該方法的實(shí)施例中進(jìn)行了詳細(xì)描述，此處將不做詳細(xì)闡述說明。
[0164]本公開一示例性實(shí)施例提供了一種GIF圖像渲染裝置，能夠?qū)崿F(xiàn)本公開提供的GIF圖像渲染方法，該GIF圖像渲染裝置包括:處理器、用于存儲(chǔ)處理器可執(zhí)行指令的存儲(chǔ)器；
[0165]其中，處理器被配置為:
[0166]檢測(cè)網(wǎng)頁中的GIF圖像是否位于瀏覽器的顯示區(qū)中；網(wǎng)頁是指被瀏覽器加載的網(wǎng)頁，GIF圖像包括η幀子圖像；
[0167]若GIF圖像位于瀏覽器的顯示區(qū)之外，則暫停對(duì)GIF圖像中的子圖像的渲染操作。
[0168]圖6是根據(jù)一示例性實(shí)施例示出的一種GIF圖像渲染裝置的框圖。例如，裝置600可以是移動(dòng)電話，計(jì)算機(jī)，數(shù)字廣播終端，消息收發(fā)設(shè)備，游戲控制臺(tái)，平板設(shè)備，醫(yī)療設(shè)備，健身設(shè)備，個(gè)人數(shù)字助理等。
[0169]參照?qǐng)D6，裝置600可以包括以下一個(gè)或多個(gè)組件:處理組件602，存儲(chǔ)器604，電源組件606，多媒體組件608，音頻組件610，輸入/輸出(I/O)接口 612，傳感器組件614，以及通信組件616。
[0170]處理組件602通?？刂蒲b置600的整體操作，諸如與顯示，電話呼叫，數(shù)據(jù)通信，相機(jī)操作和記錄操作相關(guān)聯(lián)的操作。處理組件602可以包括一個(gè)或多個(gè)處理器618來執(zhí)行指令，以完成上述的方法的全部或部分步驟。此外，處理組件602可以包括一個(gè)或多個(gè)模塊，便于處理組件602和其他組件之間的交互。例如，處理組件602可以包括多媒體模塊，以方便多媒體組件608和處理組件602之間的交互。
[0171]存儲(chǔ)器604被配置為存儲(chǔ)各種類型的數(shù)據(jù)以支持在裝置600的操作。這些數(shù)據(jù)的示例包括用于在裝置600上操作的任何應(yīng)用程序或方法的指令，聯(lián)系人數(shù)據(jù)，電話簿數(shù)據(jù)，消息，圖片，視頻等。存儲(chǔ)器604可以由任何類型的易失性或非易失性存儲(chǔ)設(shè)備或者它們的組合實(shí)現(xiàn)，如靜態(tài)隨機(jī)存取存儲(chǔ)器(SRAM)，電可擦除可編程只讀存儲(chǔ)器(EEPROM)，可擦除可編程只讀存儲(chǔ)器(EPROM)，可編程只讀存儲(chǔ)器(PROM)，只讀存儲(chǔ)器(ROM)，磁存儲(chǔ)器，快閃存儲(chǔ)器，磁盤或光盤。
[0172]電源組件606為裝置600的各種組件提供電力。電源組件606可以包括電源管理系統(tǒng)，一個(gè)或多個(gè)電源，及其他與為裝置600生成、管理和分配電力相關(guān)聯(lián)的組件。
[0173]多媒體組件608包括在裝置600和用戶之間的提供一個(gè)輸出接口的屏幕。在一些實(shí)施例中，屏幕可以包括液晶顯示器(LCD)和觸摸面板(TP)。如果屏幕包括觸摸面板，屏幕可以被實(shí)現(xiàn)為觸摸屏，以接收來自用戶的輸入信號(hào)。觸摸面板包括一個(gè)或多個(gè)觸摸傳感器以感測(cè)觸摸、滑動(dòng)和觸摸面板上的手勢(shì)。觸摸傳感器可以不僅感測(cè)觸摸或滑動(dòng)動(dòng)作的邊界，而且還檢測(cè)與觸摸或滑動(dòng)操作相關(guān)的持續(xù)時(shí)間和壓力。在一些實(shí)施例中，多媒體組件608包括一個(gè)前置攝像頭和/或后置攝像頭。當(dāng)裝置600處于操作模式，如拍攝模式或視頻模式時(shí)，前置攝像頭和/或后置攝像頭可以接收外部的多媒體數(shù)據(jù)。每個(gè)前置攝像頭和后置攝像頭可以是一個(gè)固定的光學(xué)透鏡系統(tǒng)或具有焦距和光學(xué)變焦能力。
[0174]音頻組件610被配置為輸出和/或輸入音頻信號(hào)。例如，音頻組件610包括一個(gè)麥克風(fēng)(MIC)，當(dāng)裝置600處于操作模式，如呼叫模式、記錄模式和語音識(shí)別模式時(shí)，麥克風(fēng)被配置為接收外部音頻信號(hào)。所接收的音頻信號(hào)可以被進(jìn)一步存儲(chǔ)在存儲(chǔ)器604或經(jīng)由通信組件616發(fā)送。在一些實(shí)施例中，音頻組件610還包括一個(gè)揚(yáng)聲器，用于輸出音頻信號(hào)。
[0175]I/O接口612為處理組件602和外圍接口模塊之間提供接口，上述外圍接口模塊可以是鍵盤，點(diǎn)擊輪，按鈕等。這些按鈕可包括但不限于:主頁按鈕、音量按鈕、啟動(dòng)按鈕和鎖定按鈕。
[0176]傳感器組件614包括一個(gè)或多個(gè)傳感器，用于為裝置600提供各個(gè)方面的狀態(tài)評(píng)估。例如，傳感器組件614可以檢測(cè)到裝置600的打開/關(guān)閉狀態(tài)，組件的相對(duì)定位，例如組件為裝置600的顯示器和小鍵盤，傳感器組件614還可以檢測(cè)裝置600或裝置600—個(gè)組件的位置改變，用戶與裝置600接觸的存在或不存在，裝置600方位或加速/減速和裝置600的溫度變化。傳感器組件614可以包括接近傳感器，被配置用來在沒有任何的物理接觸時(shí)檢測(cè)附近物體的存在。傳感器組件614還可以包括光傳感器，如CMOS或CCD圖像傳感器，用于在成像應(yīng)用中使用。在一些實(shí)施例中，該傳感器組件614還可以包括加速度傳感器，陀螺儀傳感器，磁傳感器，壓力傳感器或溫度傳感器。
[0177]通信組件616被配置為便于裝置600和其他設(shè)備之間有線或無線方式的通信。裝置600可以接入基于通信標(biāo)準(zhǔn)的無線網(wǎng)絡(luò)，如W1-Fi，2G或3G，或它們的組合。在一個(gè)示例性實(shí)施例中，通信組件616經(jīng)由廣播信道接收來自外部廣播管理系統(tǒng)的廣播信號(hào)或廣播相關(guān)信息。在一個(gè)示例性實(shí)施例中，通信組件616還包括近場(chǎng)通信(NFC)模塊，以促進(jìn)短程通信。例如，在NFC模塊可基于射頻識(shí)別(RFID)技術(shù)，紅外數(shù)據(jù)協(xié)會(huì)(IrDA)技術(shù)，超寬帶(UWB)技術(shù)，藍(lán)牙(BT)技術(shù)和其他技術(shù)來實(shí)現(xiàn)。
[0178]在示例性實(shí)施例中，裝置600可以被一個(gè)或多個(gè)應(yīng)用專用集成電路(ASIC)、數(shù)字信號(hào)處理器(DSP)、數(shù)字信號(hào)處理設(shè)備(DSPD)、可編程邏輯器件(PLD)、現(xiàn)場(chǎng)可編程門陣列(FPGA)、控制器、微控制器、微處理器或其他電子元件實(shí)現(xiàn)，用于執(zhí)行上述GIF圖像渲染方法。
[0179]在示例性實(shí)施例中，還提供了一種包括指令的非臨時(shí)性計(jì)算機(jī)可讀存儲(chǔ)介質(zhì)，例如包括指令的存儲(chǔ)器604，上述指令可由裝置600的處理器618執(zhí)行以完成上述GIF圖像渲染方法。例如，非臨時(shí)性計(jì)算機(jī)可讀存儲(chǔ)介質(zhì)可以是ROM、隨機(jī)存取存儲(chǔ)器(RAM)、CD-ROM、磁帶、軟盤和光數(shù)據(jù)存儲(chǔ)設(shè)備等。
[0180]本領(lǐng)域技術(shù)人員在考慮說明書及實(shí)踐這里公開的發(fā)明后，將容易想到本公開的其它實(shí)施方案。本申請(qǐng)旨在涵蓋本公開的任何變型、用途或者適應(yīng)性變化，這些變型、用途或者適應(yīng)性變化遵循本公開的一般性原理并包括本公開未公開的本技術(shù)領(lǐng)域中的公知常識(shí)或慣用技術(shù)手段。說明書和實(shí)施例僅被視為示例性的，本公開的真正范圍和精神由下面的權(quán)利要求指出。
[0181]應(yīng)當(dāng)理解的是，本公開并不局限于上面已經(jīng)描述并在附圖中示出的精確結(jié)構(gòu)，并且可以在不脫離其范圍進(jìn)行各種修改和改變。本公開的范圍僅由所附的權(quán)利要求來限制。
【主權(quán)項(xiàng)】
1.一種GIF圖像渲染方法，其特征在于，所述方法包括: 檢測(cè)網(wǎng)頁中的GIF圖像是否位于瀏覽器的顯示區(qū)中；所述網(wǎng)頁是指被所述瀏覽器加載的網(wǎng)頁，所述GIF圖像包括η幀子圖像； 若所述GIF圖像位于所述瀏覽器的顯示區(qū)之外，則暫停對(duì)所述GIF圖像中的所述子圖像的渲染操作。2.根據(jù)權(quán)利要求1所述的方法，其特征在于，所述檢測(cè)網(wǎng)頁中的GIF圖像是否位于瀏覽器的顯示區(qū)中，包括: 獲取第一區(qū)域信息，所述第一區(qū)域信息用于指示所述瀏覽器的顯示區(qū)在所述網(wǎng)頁中對(duì)應(yīng)的第一區(qū)域； 獲取第二區(qū)域信息，所述第二區(qū)域信息用于指示所述GIF圖像在所述網(wǎng)頁中對(duì)應(yīng)的第二區(qū)域； 根據(jù)所述第一區(qū)域信息和所述第二區(qū)域信息，檢測(cè)所述第一區(qū)域和所述第二區(qū)域是否存在交集，所述交集用于表示所述GIF圖像位于所述瀏覽器的顯示區(qū)中。3.根據(jù)權(quán)利要求2所述的方法，其特征在于，所述獲取第一區(qū)域信息，包括: 在所述網(wǎng)頁被加載后或者接收到移動(dòng)信號(hào)時(shí)，調(diào)用所述瀏覽器的內(nèi)核提供的預(yù)定函數(shù)接口獲取所述第一區(qū)域信息，所述第一區(qū)域信息包括所述第一區(qū)域的左頂點(diǎn)位置、橫向長(zhǎng)度和縱向長(zhǎng)度。4.根據(jù)權(quán)利要求2所述的方法，其特征在于，所述獲取第二區(qū)域信息，包括: 從渲染圖像列表中獲取與所述GIF圖像對(duì)應(yīng)的所述第二區(qū)域信息，所述第二區(qū)域信息包括所述第二區(qū)域的左頂點(diǎn)位置、橫向長(zhǎng)度和縱向長(zhǎng)度。5.根據(jù)權(quán)利要求1至4任一所述的方法，其特征在于，所述暫停對(duì)所述GIF圖像中的所述子圖像的渲染操作，包括: 向所述瀏覽器的內(nèi)核提供的GIF圖像渲染組件發(fā)送第一指令，所述第一指令用于觸發(fā)所述GIF圖像渲染組件將與所述GIF圖像對(duì)應(yīng)的定時(shí)器暫停，所述定時(shí)器用于在第i次超時(shí)后觸發(fā)所述GIF圖像渲染組件對(duì)所述GIF圖像中的第k張子圖像進(jìn)行渲染，所述定時(shí)器在每次超時(shí)后重置，k=i mod η。6.根據(jù)權(quán)利要求1至4任一所述的方法，其特征在于，所述方法還包括: 若所述GIF圖像位于所述瀏覽器的顯示區(qū)中，則執(zhí)行對(duì)所述GIF圖像中的所述子圖像的渲染操作。7.根據(jù)權(quán)利要求6所述的方法，其特征在于，所述執(zhí)行對(duì)所述GIF圖像中的所述子圖像的渲染操作，包括: 向所述瀏覽器的內(nèi)核提供的GIF圖像渲染組件發(fā)送第二指令，所述第二指令用于觸發(fā)所述GIF圖像渲染組件將與所述GIF圖像對(duì)應(yīng)的定時(shí)器開啟，所述定時(shí)器用于在第i次超時(shí)后觸發(fā)所述GIF圖像渲染組件對(duì)所述GIF圖像中的第k張子圖像進(jìn)行渲染，所述定時(shí)器在每次超時(shí)后重置，k=i mod η。8.一種GIF圖像渲染裝置，其特征在于，所述裝置包括: 檢測(cè)模塊，被配置為檢測(cè)網(wǎng)頁中的GIF圖像是否位于瀏覽器的顯示區(qū)中；所述網(wǎng)頁是指被所述瀏覽器加載的網(wǎng)頁，所述GIF圖像包括η幀子圖像； 暫停模塊，被配置為在所述GIF圖像位于所述瀏覽器的顯示區(qū)之外時(shí)，暫停對(duì)所述GIF圖像中的所述子圖像的渲染操作。9.根據(jù)權(quán)利要求8所述的裝置，其特征在于，所述檢測(cè)模塊，包括: 第一獲取子模塊，被配置為獲取第一區(qū)域信息，所述第一區(qū)域信息用于指示所述瀏覽器的顯示區(qū)在所述網(wǎng)頁中對(duì)應(yīng)的第一區(qū)域； 第二獲取子模塊，被配置為獲取第二區(qū)域信息，所述第二區(qū)域信息用于指示所述GIF圖像在所述網(wǎng)頁中對(duì)應(yīng)的第二區(qū)域； 交集檢測(cè)子模塊，被配置為根據(jù)所述第一區(qū)域信息和所述第二區(qū)域信息，檢測(cè)所述第一區(qū)域和所述第二區(qū)域是否存在交集，所述交集用于表示所述GIF圖像位于所述瀏覽器的顯示區(qū)中。10.根據(jù)權(quán)利要求9所述的裝置，其特征在于，所述第一獲取子模塊，被配置為在所述網(wǎng)頁被加載后或者接收到移動(dòng)信號(hào)時(shí)，調(diào)用所述瀏覽器的內(nèi)核提供的預(yù)定函數(shù)接口獲取所述第一區(qū)域信息，所述第一區(qū)域信息包括所述第一區(qū)域的左頂點(diǎn)位置、橫向長(zhǎng)度和縱向長(zhǎng)度。11.根據(jù)權(quán)利要求9所述的裝置，其特征在于，所述第二獲取子模塊，被配置為從渲染圖像列表中獲取與所述GIF圖像對(duì)應(yīng)的所述第二區(qū)域信息，所述第二區(qū)域信息包括所述第二區(qū)域的左頂點(diǎn)位置、橫向長(zhǎng)度和縱向長(zhǎng)度。12.根據(jù)權(quán)利要求8至11任一所述的裝置，其特征在于，所述暫停模塊，被配置為向所述瀏覽器的內(nèi)核提供的GIF圖像渲染組件發(fā)送第一指令，所述第一指令用于觸發(fā)所述GIF圖像渲染組件將與所述GIF圖像對(duì)應(yīng)的定時(shí)器暫停，所述定時(shí)器用于在第i次超時(shí)后觸發(fā)所述GIF圖像渲染組件對(duì)所述GIF圖像中的第k張子圖像進(jìn)行渲染，所述定時(shí)器在每次超時(shí)后重置，k=i mod η。13.根據(jù)權(quán)利要求8至11任一所述的裝置，其特征在于，所述裝置，還包括: 執(zhí)行模塊，被配置為在所述GIF圖像位于所述瀏覽器的顯示區(qū)中時(shí)，執(zhí)行對(duì)所述GIF圖像中的所述子圖像的渲染操作。14.根據(jù)權(quán)利要求13所述的裝置，其特征在于，所述執(zhí)行模塊，被配置為向所述瀏覽器的內(nèi)核提供的GIF圖像渲染組件發(fā)送第二指令，所述第二指令用于觸發(fā)所述GIF圖像渲染組件將與所述GIF圖像對(duì)應(yīng)的定時(shí)器開啟，所述定時(shí)器用于在第i次超時(shí)后觸發(fā)所述GIF圖像渲染組件對(duì)所述GIF圖像中的第k張子圖像進(jìn)行渲染，所述定時(shí)器在每次超時(shí)后重置，k=imod η 015.一種GIF圖像渲染裝置，其特征在于，所述裝置包括: 處理器； 用于存儲(chǔ)所述處理器可執(zhí)行指令的存儲(chǔ)器； 其中，所述處理器被配置為: 檢測(cè)網(wǎng)頁中的GIF圖像是否位于瀏覽器的顯示區(qū)中；所述網(wǎng)頁是指被所述瀏覽器加載的網(wǎng)頁，所述GIF圖像包括η幀子圖像； 若所述GIF圖像位于所述瀏覽器的顯示區(qū)之外，則暫停對(duì)所述GIF圖像中的所述子圖像的渲染操作。
【文檔編號(hào)】G06F17/30GK105894558SQ201610256494
【公開日】2016年8月24日
【申請(qǐng)日】2016年4月22日
【發(fā)明人】范金松, 王百超
【申請(qǐng)人】北京小米移動(dòng)軟件有限公司