您好,我是劉俊宏,
擔任

傑愛得資訊》 傑愛得資訊工作日誌:主機機器人代勞設計 補足系統開發的缺漏

2021/09/15

某家主機客戶當初找系統商開發網站平台系統時,平台提供給使用者上傳多處圖檔,但卻未設計圖檔的尺寸、檔案大小等控制,日積月累的圖檔造成了主機資源效能吃緊。

使用者上傳高畫質解析度的海報圖檔,由於印刷用途的圖檔大小通常都達好幾MB,也會導致網友在瀏覽平台時,需載入多張好幾MB的圖檔而感到網頁開啟緩慢。

平台系統再加入圖片上傳的檢查與壓縮功能,也是浩大工程。

但是我們找到了替代作法可以補足沒有圖片壓縮機制的設計。

基於網站平台主要在清單縮圖應用上,不需載入原始大圖的需求,畢竟清單預覽圖片只是提供給網友預視,即便在現在手機上網主流的上網習慣下,手機觀看清單縮圖也不需以原始圖檔來呈現,在手機約莫 400px 像素寬度以下的螢幕,載入原始圖檔經常大於 1200px 以上的像素寬度,實在是浪費了網路傳輸流量,因為肉眼並看不出圖檔解析差異。

因此我們針對網站平台的清單介面區,改設定以縮圖來呈現,減少每次開啟清單的10、20筆資料的縮圖圖檔傳輸流量。

我們先設計主機機器人,自動每5分鐘巡邏網站是否有新上傳圖檔,一旦有新圖上架,就自動複製產生 400px 寬度的縮圖並另存成縮圖特徵的檔案名稱。

接著讓清單區的網站程式加入判別,當該圖的縮圖格式圖檔已經產生存在,就自動改以縮圖來顯示,反之就先以原圖做顯示。

經過這樣的自動巡邏並產生縮圖的主機機器人運行,網站平台在清單介面區順利都以縮圖來呈現,讓原本可能每張原圖大於 2MB 圖寬 1500px 的清單,變成每張約莫 100KB 圖寬 400px 的縮圖。

不但每次網頁瀏覽的傳輸流量大幅降載,主機資源效能得以維持不超用吃緊,且讓網友開啟網頁時,可以有好的優速體驗,而不是龜速等待。

其實 Google 針對網站瀏覽體驗也是相當著重在網頁載入體驗,也算是 網站 UIUX 的一環,網頁開啟速度 Page Speed 必須重視,這也會影響 SEO 的經營。

透過主機建置一套自動化機器人,同時改善主機資源效能使用度、網頁傳輸流量、網友 UIUX 體驗印象、 SEO ,真是一舉多得。

Ads by jAD

 
聯播網: 吉傳媒, 傑愛得資訊, 吉拉X