參照本文闡述的詳細內容和附圖說明是最好理解本發明。下面參照附圖會討論各種實施例。然而,本領域技術人員將容易理解,這裡關於附圖給出的詳細描述僅僅是為了解釋的目的,因為這些方法和系統可超出所描述的實施例。例如,所給出的教導和特定應用的需求可能產生多種可選的和合適的方法來實現在此描述的任何細節的功能。因此,任何方法可延伸超出所描述和示出的以下實施例中的特定實施選擇範圍。
請參照圖1A與圖2,圖1A所繪示為本發明之網頁字型加載優化系統之其中一實施例的方塊圖,圖2所繪示為本發明之網頁字型加載優化方法之流程圖。網頁字型加載優化系統100包括多個元件,每個元件在過程中都扮演著不同的角色。該網頁字型加載優化100包括一個網頁伺服器110、一個網頁字型腳本132、一個網頁瀏覽器130、一個雜湊模組134和一個網頁字型伺服器150。
首先,如步驟S110所示,網頁伺服器110被配置為在收到請求時向用戶的網頁瀏覽器130提供一個網頁和與該網頁相關的資源。這些資源可能包括各種元素,如HTML、CSS、JavaScript檔案、圖像和一個網頁字型腳本132。網頁伺服器110與用戶的網頁瀏覽器130進行通信,傳遞這些資源,使網頁瀏覽器130能夠為用戶渲染網頁。資源的傳遞通常通過標準協議如HTTP或HTTPS來實現。
接著,如步驟S132所示,網頁字型腳本132是從網頁伺服器110下載的特定資源。一旦下載,如步驟S130所示,它就在用戶的網頁瀏覽器130上運行,並確定網頁所需的字符集和字型資訊。字符集和字型資訊對於網頁的視覺呈現至關重要,它決定了要在網頁上顯示的特定字符及其風格表示。
此外,網頁瀏覽器130還與網頁字型伺服器150互動,發送字型子集152的請求並將收到的字型子集152應用於網頁。雜湊模組134是一個根據網頁字型腳本132確定的字符集和字型資訊生成雜湊值的元件。如步驟S134所示,雜湊模組134使用加密雜湊演算法,如MD5、SHA-2、或SHA-3,來生成與特定字符集和字型資訊組合唯一相關的雜湊值。這個雜湊值作為與字符集和字型資訊相對應的字型子集的獨特標識符。
網頁字型伺服器150被配置為接收基於雜湊模組134生成的雜湊值以請求字型子集。收到請求後,如步驟S150所示,網頁字型伺服器150檢查是否存在與請求的雜湊值相對應的字型子集152。如果這樣的字型子集152存在,則如步驟S136所示,網頁字型伺服器150將字型子集152返回給網頁瀏覽器130。如果沒有這樣的字型子集152存在,則如步驟S170所示,網頁字型伺服器150會根據網頁字型腳本130發送的字符集和字型資訊生成一個新的字型子集152。然後,新生成的字型子集152將與其對應的雜湊值一起存儲在網頁字型伺服器150上,以供未來使用。
以上,是對本發明之網頁字型加載優化方法與系統的簡介,以下將對所述方法與系統中所牽涉到的元件和步驟進行更詳細的介紹,請繼續參照圖1A與圖2。
在網頁伺服器110提供的資源中,網頁字型腳本132在優化網頁字型加載的過程中扮演著特定的角色。一旦從網頁伺服器110下載了網頁字型腳本132,它就在用戶的網頁瀏覽器130上運行。網頁字型腳本132的主要功能是確定網頁所需的字符集和字型資訊。這個識別過程涉及掃描網頁內容並確定要顯示的特定字符,以及由字型資訊決定的他們的風格表示。
網頁字型腳本132確定的字符集和字型資訊對於網頁的視覺呈現至關重要。字符集包括要在網頁上顯示的特定字符,如字母、數字、標點符號和特殊字符。另一方面,字型資訊決定了這些字符的風格表示,包括如字體、大小、權重和風格等方面。字符集和字型資訊共同決定了網頁文本的視覺外觀,對整體用戶體驗有所貢獻。
雜湊模組134是網頁字型加載優化系統100中的一個關鍵元件,負責根據網頁字型腳本132確定的字符集和字型資訊生成雜湊值。雜湊值作為一個獨特的標識符,與特定的字符集和字型資訊組合唯一相關。這個標識符在從網頁字型伺服器150請求和檢索相應的字型子集152的過程中起著關鍵的作用。
雜湊模組134使用加密雜湊演算法來生成雜湊值。加密雜湊演算法是數學演算法,它接受一個輸入並返回一個固定大小的字節串,亦即:雜湊值。這些演算法的特性是它們是確定的,意味著相同的輸入將始終產生相同的雜湊值。然而,輸入的微小變化可以導致雜湊值有顯著的不同,這是一種被稱為雪崩效應(Avalanche effect )的現象。這種特性在本案之網頁字型加載優化系統100的脈絡中是有利的,因為它確保了不同的字符集和字型資訊組合將產生不同的雜湊值,從而方便準確地檢索相應的字型子集152。
雜湊模組134可以使用的加密雜湊演算法包括MD5、SHA-2、以及SHA-3。MD5,即'Message Digest Algorithm 5',是一種廣泛使用的加密雜湊函數,它產生一個128位的雜湊值。它通常用於驗證資料完整性。另一方面,SHA-2是一組加密雜湊函數,包括SHA-224、SHA-256、SHA-384、SHA-512、SHA-512/224和SHA-512/256。名稱中的數字表示函數產生的雜湊值的長度。由於它們的雜湊值較長,SHA-2函數被認為比MD5更安全,使它們不易受到碰撞攻擊。另外,SHA-3是加密雜湊函數的最新系列,它提供了與SHA-2不同的設計,進一步增強了安全性和抗碰撞攻擊的能力。SHA-3在安全性上的提升使其成為處理高度敏感數據時的理想選擇。
在本網頁字型加載優化系統100的脈絡中,雜湊模組134將選定的加密雜湊演算法應用於網頁字型腳本132所確定的字符集和字型資訊。然後,生成的雜湊值被用作從網頁字型伺服器150請求相應的字型子集的標識符。基於字符集和字型資訊生成雜湊值並使用它來請求相應的字型子集152的過程是系統運作的核心部分,對於在網頁瀏覽器130中優化網頁字型加載有著重要的貢獻。
網頁字型伺服器150對於優化網頁字型加載的過程起著關鍵作用。網頁字型伺服器150被配置為根據雜湊模組134生成的雜湊值接收字型子集152的請求。這些請求由在用戶的網頁瀏覽器130上運行的網頁字型腳本132發送,該網頁字型腳本132根據為網頁確定的字符集和字型資訊生成一個雜湊值。
在收到請求後,網頁字型伺服器150檢查是否存在與請求的雜湊值相對應的字型子集152。這是通過將接收到的雜湊值與存儲在伺服器上的字型子集的雜湊值進行比較來實現的。如果找到了與雜湊值匹配的字型子集152,則表示在網頁字型伺服器150上已經存在一個與字符集和字型資訊匹配的字型子集。這可能是因為該字型子集已經為相同或不同的網頁先前加載過,或者是因為自上次加載以來網頁內容沒有變化。在這種情況下,網頁字型伺服器150將現有的字型子集152返回給網頁瀏覽器130。
如果網頁字型伺服器150沒有找到與雜湊值匹配的字型子集152,則表示在網頁字型伺服器150上不存在與字符集和字型資訊相對應的字型子集。這可能是因為該字型子集以前沒有被加載過,或者是因為自上次加載以來網頁內容已經變化,需要一個新的字型子集。在這種情況下,網頁字型伺服器150中的字型生成模組154會根據網頁字型腳本132發送的字符集和字型資訊生成一個新的字型子集152。在其中一實施例中,為了提升數據傳輸的效率,所使用的字符集是經過移除重複字符後的資料。
除了上一段所述方式外,還可以採用其他方式產生新的字型子集。請同時參照圖1B,在此實施例中,網頁字型伺服器150儲存有一常用字型檔案151。當網頁字型伺服器150接收到來自網頁瀏覽器130的字符集和字型資訊請求時,會首先判斷其常用字型檔案151中是否已經存在匹配的字型子集。如果存在,則會根據該請求進行以下操作:
(a) 若所述常用字型檔案151完全涵蓋所需的字符集和字型資訊,網頁字型伺服器150將直接將該常用字型檔案151的URL發送到網頁瀏覽器130。這樣做可以有效減少字型加載時間並提升效率,因為沒有必要創建新的字型子集。
(b) 另一方面,如果所需的字符集和字型資訊只佔常用字型檔案所包含的一小部分,網頁字型伺服器150的字型抽取模組153會從該常用字型檔案151中抽取出所需的特定字符集和字型資訊,並根據這些資訊創建一個新的字型子集。這個新創建的字型子集將只包含網頁瀏覽器130所請求的特定字符和字型,從而提高加載效率並減少不必要的數據傳輸。
在上述兩種情況中,網頁字型伺服器150都將相應的URL發送到網頁瀏覽器130,以便將相應的字型子集應用於所請求的網頁。這種方法確保了只有必要的字型數據被加載,從而優化了整體網頁加載過程。在本實施例中,常用字型檔案151是網頁字型伺服器150中一個關鍵的元件,旨在儲存一組廣泛使用的字符和字型,這些字符和字型被認為是最常出現在多數網頁請求中。常用字型檔案151被設計為包含足夠多樣化的字符集,以滿足大多數網頁的基本需求。這樣,當網頁瀏覽器130請求特定字符集時,網頁字型伺服器150可以首先檢查常用字型檔案151,以確定是否已經有一個預先生成的、包含所需字符的字型子集。
由於常用字型檔案151的存在,網頁字型伺服器150在許多情況下能夠迅速回應字型請求,無需每次都生成新的字型子集。這種方式不僅節省了處理時間,還減少了網頁字型伺服器150的負荷,同時提高了網頁加載速度。常用字型檔案151的內容可以根據過去的使用數據和趨勢進行定期更新,以保證其始終反映最常見的網頁字型使用情況。
生成新的字型子集152的過程涉及根據字符集和字型資訊創建一個字型子集。字型子集152包括要在網頁上顯示的特定字符,並根據字型資訊進行風格設定。一旦生成了新的字型子集152,它就會與其對應的雜湊值一起存儲在網頁字型伺服器150上。存儲雜湊值使網頁字型伺服器150能夠快速且準確地為未來的請求檢索字型子集152。這個存儲過程是由映射模組156來負責,系統運作的核心部分,對於在網頁瀏覽器130中優化網頁字型加載有著重要的貢獻。映射模組156在記錄網頁字型伺服器150上的雜湊值和字型子集152之間的映射中扮演著關鍵的角色。這種映射對於未來請求的字型子集152的高效檢索至關重要。映射模組156是網頁字型伺服器150的一個元件,設計用來記錄由雜湊模組134生成的雜湊值和存儲在網頁字型伺服器150上的相應字型子集152之間的關聯。這種關聯,或映射,是雜湊值和字型子集152之間的一對一對應,這意味著每個雜湊值都與一個特定的字型子集152唯一相關,反之亦然。
此外,除了映射模組156在記錄雜湊值和字型子集152之間關係的作用外,網頁字型伺服器150還包括一個命名模組158,該命名模組158負責將每個字型子集152以其對應的雜湊值命名。這種命名方法不僅提高了檢索效率,還增加了字型子集的識別性。每個字型子集的名稱都是根據雜湊模組134生成的唯一雜湊值而定,這確保了名稱的唯一性和一致性。通過這種方式,當網頁瀏覽器130發出請求時,網頁字型伺服器150能夠快速地定位和提供正確的字型子集,從而進一步優化網頁字型的加載過程。在某些實施例中,命名模組158和映射模組156可以同時存在,而在某些實施例中,命名模組158和映射模組156則可以擇一存在。
通過採用這種過程,網頁字型伺服器150有效地管理字型子集152的存儲和檢索,優化了網頁瀏覽器130中的網頁字型加載。這個過程顯著減少了與網頁字型加載相關的計算開銷,特別是對於內容在多次訪問中保持不變的靜態網站。此外,通過存儲雜湊值以供未來使用,網頁字型伺服器150促進了字型子集152的快速和準確檢索,進一步提高了系統的效率。
以下,將介紹把字型子集152應用於網頁的過程,請同時參照圖3。這個過程涉及幾個步驟,每個步驟都對網頁文本的視覺呈現有所貢獻,而這個過程則是由網頁顯示程式136來實現(如圖4所示)。網頁顯示程式136也是由網頁字型伺服器150下載而來,包括URL插入模組162、下載模組164和渲染模組166,這些模組在將字型子集152應用於網頁的過程中都扮演著不同的角色。
首先,如步驟S210所示,URL插入模組162將字型子集152所對應的URL添加到網頁。URL,Uniform Resource Locator (全球資源定位器,通常稱為“網址”),在本實施例中是對儲存在網頁字型伺服器150上的字型子集152的引用,它提供了字型子集152在網頁字型伺服器150上的位置和檢索它的協議。字型子集152所對應的URL由在用戶的網頁瀏覽器130上運行的網頁字型腳本添加到網頁,這通常是通過將URL插入到網頁的HTML或CSS中來進行。
一旦將字型子集152所對應的URL添加到網頁,下一步就是下載模組164根據URL下載字型子集152(如步驟S220所示)。這是下載模組164使用URL向網頁字型伺服器150發送請求,促使網頁字型伺服器150將字型子集152通過網路傳輸。網頁字型伺服器150對請求作出回應,將字型子集152發送到網頁瀏覽器130。該檔案通過網路傳輸並由網頁瀏覽器130接收,該網頁瀏覽器130將其存儲在本地,以便在渲染網頁文本時使用。
再來,如步驟S230所示,在網頁瀏覽器130中渲染字型子集,這可以由渲染模組166來執行。字型子集包含在網頁上要顯示的特定字符,並根據字型資訊進行風格設定。網頁瀏覽器130中的渲染模組166使用這個字型子集來渲染網頁文本,將默認或先前應用的字型替換為字型子集指定的字型。這個渲染過程由渲染模組166與網頁瀏覽器130的渲染引擎一起工作,該渲染引擎解釋網頁的HTML、CSS和其他資源,包括字型子集150,以生成網頁的視覺呈現。
通過這些步驟,網頁字型伺服器150返回的字型子集被應用於網頁,對網頁文本的視覺呈現有所貢獻。這個過程是系統運作的一個整體部分,使網頁瀏覽器130能夠有效地加載網頁字型,並提高了整體用戶體驗。
網頁字型加載優化系統100具有幾個潛在的優點,特別是在計算效率和網頁加載速度方面。一個主要的優點是減少了與網頁字型加載相關的計算開銷。通過採用基於雜湊的方法來請求和檢索字型子集,系統消除了特別是對於內容在多次訪問中保持不變的靜態網站的冗餘字型子集生成。這顯著減少了網頁字型伺服器150消耗的計算資源,從而提高了網頁字型加載優化系統100的整體效率。
網頁字型加載優化系統100的另一個顯著優點是提高網頁加載速度。通過在網頁字型伺服器150上存儲雜湊值和相應的字型子集,系統100便於根據雜湊值快速且準確地檢索字型子集152。這消除了每次加載網頁時在網頁字型伺服器150上搜索字型子集152的耗時過程,從而減少了網頁加載時間。這種加載速度的提高對用戶體驗特別有利,因為它減少了用戶的等待時間,並使他們能夠更快地與網頁互動。
此外,網頁字型加載優化系統100在處理網頁字型加載的效率對於靜態網站特別有利,其中的內容在多次訪問中保持不變。在這種情況下,系統可以根據雜湊值檢索先前加載的字型子集152,消除了每次加載網頁時生成新字型子集的不必要性。這不僅減少了網頁字型伺服器的計算開銷,而且提高了網頁加載速度,從而提升了整體的用戶體驗。
值得注意的是,這些優點可能存在於系統的一個或多個實施例中。實現的具體好處可能取決於各種因素,如系統的具體配置、網頁的特性和字型子集的性質。無論如何,系統優化網頁字型加載的方法提供了一種有前景的解決方案,以應對傳統網頁字型加載技術的挑戰,提供了在計算效率、網頁加載速度和用戶體驗方面的潛在改進。
雖然本發明已以較佳實施例揭露如上,然其並非用以限定本發明,任何所屬技術領域中具有通常知識者,在不脫離本發明之精神和範圍內,當可作些許之更動與潤飾,因此本發明之保護範圍當視後附之申請專利範圍所界定者為準。
The present invention is best understood by referring to the detailed description and accompanying figures. Various embodiments will be discussed below with reference to the figures. However, those skilled in the art will readily understand that the detailed descriptions given in the figures are for illustrative purposes only, as these methods and systems may extend beyond the embodiments described. For example, the given instruction and the requirements of a particular application may result in a variety of alternative and suitable methods to implement the functionality of any details described herein. Therefore, any method may extend beyond the specific embodiment choices in the following embodiments described and shown. Please refer to Figures 1A and 2, where Figure 1A is a block diagram illustrating one embodiment of the webpage font loading optimization system of the present invention, and Figure 2 is a flowchart illustrating the webpage font loading optimization method of the present invention. The webpage font loading optimization system 100 comprises multiple components, each playing a different role in the process. The webpage font loading optimization system 100 includes a webpage server 110, a webpage font script 132, a webpage browser 130, a miscellaneous module 134, and a webpage font server 150. First, as shown in step S110, the webpage server 110 is configured to provide a webpage and associated resources to the user's webpage browser 130 upon receiving a request. These resources may include various elements such as HTML, CSS, JavaScript files, images, and a webpage font script 132. Web server 110 communicates with the user's web browser 130, transmitting these resources so that the web browser 130 can render web pages for the user. The transmission of resources is typically achieved via standard protocols such as HTTP or HTTPS. Next, as shown in step S132, the web page font script 132 is a specific resource downloaded from web server 110. Once downloaded, as shown in step S130, it runs on the user's web browser 130 and determines the character set and font information required for the web page. The character set and font information are crucial for the visual presentation of the web page, determining the specific characters to be displayed on the web page and their stylistic representation. Furthermore, the web browser 130 interacts with the web font server 150, sending requests for font subsets 152 and applying the received font subsets 152 to the webpage. A hash module 134 is a component that generates hash values based on the character set and font information determined by the web font script 132. As shown in step S134, the hash module 134 uses a cryptographic hash algorithm, such as MD5, SHA-2, or SHA-3, to generate a hash value uniquely associated with a specific combination of character set and font information. This hash value serves as a unique identifier for the font subset corresponding to the character set and font information. The web font server 150 is configured to receive a hash value generated based on the hash module 134 to request a font subset. Upon receiving the request, as shown in step S150, the web font server 150 checks whether a font subset 152 corresponding to the requested hash value exists. If such a font subset 152 exists, then as shown in step S136, the web font server 150 returns the font subset 152 to the web browser 130. If no such font subset 152 exists, then as shown in step S170, the web font server 150 generates a new font subset 152 based on the character set and font information sent by the web font script 130. Then, the newly generated font subset 152, along with its corresponding hash value, is stored on the web font server 150 for future use. The above is a brief introduction to the web font loading optimization method and system of the present invention. The following will provide a more detailed description of the components and steps involved in the method and system; please continue to refer to Figures 1A and 2. Among the resources provided by the web server 110, the web font script 132 plays a specific role in optimizing web font loading. Once the web font script 132 is downloaded from the web server 110, it runs on the user's web browser 130. The main function of the web font script 132 is to determine the character set and font information required by the webpage. This recognition process involves scanning the webpage content and determining the specific characters to be displayed, as well as their stylistic representation determined by font information. The character set and font information determined by the webpage font script 132 are crucial to the visual presentation of the webpage. The character set includes the specific characters to be displayed on the webpage, such as letters, numbers, punctuation marks, and special characters. On the other hand, font information determines the stylistic representation of these characters, including aspects such as font, size, weight, and style. The character set and font information together determine the visual appearance of the webpage text and contribute to the overall user experience. Hash module 134 is a key component of the web font loading optimization system 100, responsible for generating hash values based on the character set and font information determined by the web font script 132. The hash value acts as a unique identifier, uniquely associated with a specific combination of character set and font information. This identifier plays a crucial role in the process of requesting and retrieving the corresponding font subset 152 from the web font server 150. Hash module 134 uses a cryptographic hash algorithm to generate the hash value. The cryptographic hash algorithm is a mathematical algorithm that accepts one input and returns a fixed-size byte string, i.e., the hash value. The characteristic of these algorithms is that they are deterministic, meaning that the same input will always produce the same hash value. However, small changes in the input can lead to significant differences in the hash value, a phenomenon known as the avalanche effect. This characteristic is advantageous in the context of the webpage font loading optimization system 100 in this case, as it ensures that different combinations of character sets and font information will produce different hash values, thereby facilitating accurate retrieval of the corresponding font subset 152. The cryptographic hash algorithms that the hash module 134 can use include MD5, SHA-2, and SHA-3. MD5, short for 'Message Digest Algorithm 5', is a widely used cryptographic hash function that produces a 128-bit hash value. It is typically used to verify data integrity. SHA-2, on the other hand, is a set of cryptographic hash functions, including SHA-224, SHA-256, SHA-384, SHA-512, SHA-512/224, and SHA-512/256. The numbers in the names indicate the length of the hash value produced by the function. Due to their longer hash values, SHA-2 functions are considered more secure than MD5, making them less susceptible to collision attacks. Additionally, SHA-3 is the latest family of cryptographic hash functions, offering a different design from SHA-2 and further enhancing security and resistance to collision attacks. The enhanced security of SHA-3 makes it an ideal choice for handling highly sensitive data. In the context of this webpage font loading optimization system 100, the hash module 134 applies a selected cryptographic hash algorithm to the character set and font information determined by the webpage font script 132. The generated hash value is then used as an identifier to request the corresponding font subset from the webpage font server 150. The process of generating a hash value based on the character set and font information and using it to request the corresponding font subset 152 is a core part of the system's operation and plays a crucial role in optimizing webpage font loading in the webpage browser 130. The webpage font server 150 plays a key role in optimizing the webpage font loading process. Web font server 150 is configured to receive requests for font subset 152 based on a hash value generated by hash module 134. These requests are sent by web font script 132 running on the user's web browser 130, which generates a hash value based on the character set and font information determined for the webpage. Upon receiving a request, web font server 150 checks whether a font subset 152 exists corresponding to the requested hash value. This is done by comparing the received hash value with the hash values of font subsets stored on the server. If a font subset 152 matching the hash value is found, it means that a font subset matching the character set and font information already exists on the web font server 150. This could be because the font subset has been previously loaded for the same or different webpages, or because the webpage content has not changed since the last load. In this case, the web font server 150 returns the existing font subset 152 to the webpage browser 130. If the web font server 150 does not find a font subset 152 matching the hash value, it means that a font subset corresponding to the character set and font information does not exist on the web font server 150. This could be because the font subset has not been loaded before, or because the webpage content has changed since the last load, requiring a new font subset. In this case, the font generation module 154 in the web font server 150 generates a new font subset 152 based on the character set and font information sent by the web font script 132. In one embodiment, to improve data transmission efficiency, the character set used is data after removing duplicate characters. In addition to the method described above, other methods can be used to generate new font subsets. Referring also to Figure 1B, in this embodiment, the web font server 150 stores a frequently used font file 151. When the web font server 150 receives a request for character set and font information from the web browser 130, it first determines whether a matching font subset already exists in its frequently used font file 151. If present, the following actions will be taken based on the request: (a) If the commonly used font file 151 completely covers the required character set and font information, the web font server 150 will directly send the URL of the commonly used font file 151 to the web browser 130. This effectively reduces font loading time and improves efficiency because there is no need to create a new font subset. (b) On the other hand, if the required character set and font information only constitute a small portion of what is contained in the commonly used font file, the font extraction module 153 of the web font server 150 will extract the specific character set and font information required from the commonly used font file 151 and create a new font subset based on this information. This newly created font subset will contain only the specific characters and fonts requested by the web browser 130, thereby improving loading efficiency and reducing unnecessary data transmission. In both cases, the web font server 150 sends the corresponding URL to the web browser 130 to apply the corresponding font subset to the requested webpage. This method ensures that only the necessary font data is loaded, thereby optimizing the overall webpage loading process. In this embodiment, the common font file 151 is a key component of the web font server 150, designed to store a set of widely used characters and fonts that are considered to appear most frequently in most webpage requests. The common font file 151 is designed to contain a sufficiently diverse character set to meet the basic needs of most webpages. In this way, when a web browser 130 requests a specific character set, the web font server 150 can first check the frequently used font file 151 to determine if a pre-generated subset of fonts containing the required characters already exists. Due to the existence of the frequently used font file 151, the web font server 150 can respond quickly to font requests in many cases, without having to generate a new font subset each time. This not only saves processing time but also reduces the load on the web font server 150, while improving webpage loading speed. The content of the frequently used font file 151 can be updated regularly based on past usage data and trends to ensure that it always reflects the most common web font usage. The process of generating a new font subset 152 involves creating a font subset based on the character set and font information. Font subset 152 includes specific characters to be displayed on the webpage and is styled according to the font information. Once the new font subset 152 is generated, it is stored on the webpage font server 150 along with its corresponding hash value. Storing the hash value allows the webpage font server 150 to quickly and accurately retrieve the font subset 152 for future requests. This storage process is handled by the mapping module 156, a core part of the system operation, which plays a crucial role in optimizing webpage font loading in the webpage browser 130. Mapping module 156 plays a crucial role in recording the mapping between hash values on the web font server 150 and font subsets 152. This mapping is essential for efficient retrieval of future requested font subsets 152. Mapping module 156 is a component of the web font server 150 designed to record the association between hash values generated by hash module 134 and the corresponding font subsets 152 stored on the web font server 150. This association, or mapping, is a one-to-one correspondence between hash values and font subsets 152, meaning that each hash value is uniquely associated with a specific font subset 152, and vice versa. In addition to the mapping module 156's role in recording the relationship between hash values and font subsets 152, the web font server 150 also includes a naming module 158, which is responsible for naming each font subset 152 with its corresponding hash value. This naming method not only improves retrieval efficiency but also increases the recognizability of font subsets. The name of each font subset is determined based on a unique hash value generated by the hash module 134, ensuring the uniqueness and consistency of the names. In this way, when the web browser 130 issues a request, the web font server 150 can quickly locate and provide the correct font subset, thereby further optimizing the web font loading process. In some embodiments, naming module 158 and mapping module 156 can coexist, while in other embodiments, only one of them can exist. By employing this process, the web font server 150 effectively manages the storage and retrieval of the font subset 152, optimizing web font loading in the web browser 130. This process significantly reduces the computational overhead associated with web font loading, especially for static websites where content remains unchanged across multiple visits. Furthermore, by storing hash values for future use, the web font server 150 facilitates fast and accurate retrieval of the font subset 152, further improving system efficiency. The following describes the process of applying font subset 152 to a webpage, with reference to Figure 3. This process involves several steps, each contributing to the visual presentation of the webpage text, and is implemented by the webpage display program 136 (as shown in Figure 4). The webpage display program 136, also downloaded from the webpage font server 150, includes a URL insertion module 162, a download module 164, and a rendering module 166, each playing a different role in applying font subset 152 to the webpage. First, as shown in step S210, the URL insertion module 162 adds the URL corresponding to font subset 152 to the webpage. A URL, or Uniform Resource Locator (often referred to as a "web address"), in this embodiment, is a reference to a font subset 152 stored on a web font server 150. It provides the location of the font subset 152 on the web font server 150 and the protocol for retrieving it. The URL corresponding to the font subset 152 is added to the webpage by a web font script running on the user's web browser 130, typically by inserting the URL into the webpage's HTML or CSS. Once the URL corresponding to the font subset 152 is added to the webpage, the next step is for the download module 164 to download the font subset 152 according to the URL (as shown in step S220). This involves download module 164 sending a request to web font server 150 using a URL, prompting web font server 150 to transmit font subset 152 over the network. Web font server 150 responds to the request by sending font subset 152 to web browser 130. This file is transmitted over the network and received by web browser 130, which stores it locally for use when rendering webpage text. Next, as shown in step S230, the font subset is rendered in web browser 130, which can be performed by rendering module 166. The font subset contains specific characters to be displayed on the webpage and is styled based on font information. The rendering module 166 in web browser 130 uses this font subset to render webpage text, replacing the default or previously applied fonts with those specified by the font subset. This rendering process is carried out by rendering module 166 working in conjunction with the rendering engine of web browser 130, which interprets the webpage's HTML, CSS, and other resources, including font subset 150, to generate the visual presentation of the webpage. Through these steps, the font subset returned by webpage font server 150 is applied to the webpage, contributing to the visual presentation of the webpage text. This process is an integral part of the system's operation, enabling webpage browser 130 to efficiently load webpage fonts and improving the overall user experience. The web font loading optimization system 100 has several potential advantages, particularly in terms of computational efficiency and webpage loading speed. A major advantage is the reduction of computational overhead associated with webpage font loading. By employing a hash-based method to request and retrieve font subsets, the system eliminates redundant font subset generation, especially for static websites where the content remains unchanged across multiple visits. This significantly reduces the computational resources consumed by the webpage font server 150, thereby improving the overall efficiency of the webpage font loading optimization system 100. Another significant advantage of the webpage font loading optimization system 100 is improved webpage loading speed. By storing the hash value and the corresponding font subset on the web font server 150, the system 100 can quickly and accurately retrieve the font subset 152 based on the hash value. This eliminates the time-consuming process of searching for the font subset 152 on the web font server 150 every time the webpage is loaded, thereby reducing webpage loading time. This increased loading speed is particularly beneficial to user experience because it reduces user wait time and allows them to interact with web pages more quickly. Furthermore, the web page font loading optimization system 100 is especially advantageous for static websites where the content remains unchanged across multiple visits. In this case, the system can retrieve previously loaded font subsets 152 based on hash values, eliminating the unnecessary generation of new font subsets each time the webpage is loaded. This not only reduces the computational overhead of the web page font server but also improves web page loading speed, thereby enhancing the overall user experience. It is worth noting that these advantages may exist in one or more implementations of the system. The specific benefits may depend on various factors, such as the specific system configuration, the characteristics of the webpage, and the nature of the font subset. In any case, the method of optimizing webpage font loading offers a promising solution to address the challenges of traditional webpage font loading techniques, providing potential improvements in computational efficiency, webpage loading speed, and user experience. Although the invention has been disclosed above with reference to preferred embodiments, it is not intended to limit the invention. Any person skilled in the art can make modifications and refinements without departing from the spirit and scope of the invention; therefore, the scope of protection of the invention shall be determined by the appended claims.