画像アップロードする際に、最近ではクライアントサイドであらかじめサイズを圧縮しておくのが主流である。
スマホカメラの高性能化に伴い写真が高画質になり、ファイルサイズが大きくなっているためである。
場合によっては10MB近いサイズになることもある。
最適化されていないWebサービスだと、スマホで撮影した写真をそのままサーバーサイドにアップロードしているケースが見受けられる。
ユーザーとしては何気なく写真をアップロードしただけなのに、数秒待たされることになりユーザー体験(UX)として悪い印象を与えてしまう。
画像アップロードのフローからみる改善点
スマホ ①=> サーバーサイド ②=> ファイルストレージ
上記はスマホから撮影した写真をWebサービスを通じてアップロードした際のフロー図である。
①のアップロード部分はスマホ(クライアント)側のネットワーク速度に依存するため、通信が不安定な状態だといつまでたってもアップロード処理が終わらない。 (10MBの画像を上り1Mbsの速度だとすると10秒以上かかる)
②はサーバーサイドなので通信による影響はある程度制御できる。
安定した状態であれば10MB程度のアップロードは1秒未満で完了するためそれほど問題にはならない。
クライアントサイドで画像サイズを1/10(1MB)まで圧縮できれば、①の処理は1秒程度で完了する。
②の処理においてもあらかじめ圧縮された状態であれば、さらに処理が早くなる。
それゆえに、クライアントサイドで画像を圧縮した上でアップロードすることはとても重要なのである。
(保険としてサーバーサイドでも圧縮処理を掛けておくべきであるのは言うまでもない)