Web frontend performance tuning

I have tried some techniques to resolve some media loading problems.

The lessons learned were:

1. Profiling the web threading performance in advance may avoid unnecessary development costs.
2. Web workers are good if you don’t have scripts dependencies.
3. Web browsers have dedicated computing threads for loading Base64 encoded images. No need to recreate the web workers.
4. Try Apache WebSocket proxy if you have restricted firewall access rules.

References:

• Optimized media loading using the Web Workers API, https://blog.logrocket.com/optimized-media-loading-web-workers/
• Frontend performance optimization (Chinese). https://segmentfault.com/a/1190000039157302
• JavaScript 使用 Web Worker 處理複雜任務. https://www.wowio.co/2022/02/27/javascript-%E4%BD%BF%E7%94%A8-web-worker-%E8%99%95%E7%90%86%E8%A4%87%E9%9B%9C%E4%BB%BB%E5%8B%99/#google_vignette
• Web workers: Transferable objects. https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API/Transferable_objects