InfoQ Geekathon 大模型技术应用创新大赛 了解详情
写点什么

LinkedIn 是如何优化主页的

  • 2015-04-13
  • 本文字数:1502 字

    阅读完需:约 5 分钟

考虑到 LinkedIn 主页的重要性,LinkedIn 的工程团队对其主页从根本上进行了重新设计,使得主页内容的加载速度有了很大的提高,并实现了主页的快速迭代更新,从而大大提高了用户的体验。LinkedIn 的资深工程经理 Nash Raghavan 分享了这次优化涉及到的经验和技术。现对本次优化的背景以及优化的内容进行一个全面的梳理,以供读者学习和参考。

1. 背景
LinkedIn 重新设计其主页的目标包括:

  • 尽可能提供最快的页面加载时间;
  • 避免主页的全页面加载以创建一个响应式和交互式的用户体验;
  • 实现全自动化的 QA 和测试;
  • 实现较高的版本发布频率。

旧的主页由一个基于 Java 的可定制 Web 框架构建而成,其属于一个非常糟糕的设计,并存在着一些有待改进的地方:

  • 该框架缺少文档,所以很难在不同组织以及同一组织内部进行分享;
  • 该框架主要为面向服务器的页面而设计,所以利用它很难开发出响应式的 Web 应用;
  • 许多页面和跨多个服务的 API 都封装在一个单独且庞大的库中,这就使得测试和快速迭代发布变得非常困难。

于是,LinkedIn 重新构建了一个开源的 Web 框架 Play ,并对开源 HTML 模板框架 dust.js 进行了大量投入,最终结合这两种技术实现了一个开源的 Web 开发栈,该栈能够实现服务器端和客户端的渲染。新旧技术栈结构对比情况如下图所示:

2. 快速迭代
现在基本每天都发布主页,自动化测试套仅需要 45 分钟即刻完成;而旧的主页只能做到每月发布一次,且有大量的人工工作,这种效果得益于如下几点:

  • Play 框架和 dust.js 组成的技术栈;
  • 为主页的代码创建了一个独立的 Git 库;
  • 主页成为独立、可单独部署的单元且具有自己的服务器;
  • 单元测试、功能测试、集成测试、系统测试等都实现了自动化。

3. 页面加载
优化页面加载时间是目前为止遇到的最困难问题,这是因为主页承载着成百上千个服务,所以需要很长时间来理解哪些地方加载比较耗费时间以及怎么优化相关瓶颈。为了优化页面加载时间,LinkedIn 引入了以下四种主要技术:

  • 服务器端渲染 (SSR):服务器端渲染技术使得页面能够在服务器端即刻实现渲染,从而减少了浏览器端的大量 JavaScript 和不可避免的计算。
  • 页面加载技术 BigPipe
    该技术使得开发者能够流化主页和在等待所有依赖页面准备好前就可以在浏览器上渲染,从实现了主页的一些部分比其他部分能够较快地提供给用户使用,其他部分又能够尽快得到渲染,而不是等待和立刻渲染页面的所有部分。
  • 图片延迟加载
    最难评估和很难控制的一件事情是图片加载,特别是来自第三方的图片,这是因为这类图片有可能没有驻留在 CDN。因此,延迟图片的加载直到页面完全加载,且能够用于交互,这样就能够使得用户能够读取信息和在图片加载前就能够同页面内容进行交互。
  • 减少重定向
    重定向给用户带来了较高的延迟,尤其是低速或者高延迟网络(如移动网络)下的用户。LinkedIn 减少了所需重定向的次数,并在 ATS (即反向代理服务器 Apache Traffic Server)中实现请求转向。

现在,尽管 LinkedIn 已经有了一个加载非常快的主页,但是 LinkedIn 仍在不断努力地研究新技术以进一步优化主页。LinkedIn 正在研究的技术包括:

  • 在采用比较适于异步编程的 Scala 基础上,准备利用具有 Lambda 特性的 Java 8 进一步提高性能;
  • 为了支持响应式和交互式的页面,创建了一个可定制的客户端 MVC JavaScript 框架;此外,当前正在研究类似 Ember.js 的框架,用来确定是否能够使用一个更加可扩展的客户端 MVC 框架;
  • 为了能够做到每天能够多次发布版本,正在研究更多的自动化框架。

感谢郭蕾对本文的审校。

给InfoQ 中文站投稿或者参与内容翻译工作,请邮件至 editors@cn.infoq.com 。也欢迎大家通过新浪微博( @InfoQ @丁晓昀),微信(微信号: InfoQChina )关注我们,并与我们的编辑和其他读者朋友交流。

活动推荐:

2023年9月3-5日,「QCon全球软件开发大会·北京站」 将在北京•富力万丽酒店举办。此次大会以「启航·AIGC软件工程变革」为主题,策划了大前端融合提效、大模型应用落地、面向 AI 的存储、AIGC 浪潮下的研发效能提升、LLMOps、异构算力、微服务架构治理、业务安全技术、构建未来软件的编程语言、FinOps 等近30个精彩专题。咨询购票可联系票务经理 18514549229(微信同手机号)。

2015-04-13 07:382171
用户头像

发布了 46 篇内容, 共 50.4 次阅读, 收获喜欢 15 次。

关注

评论

发布
暂无评论
发现更多内容

面试90%会问到的200+Java面试题汇总(含答案解析)

钟奕礼

Java java程序员 java面试 java编程

JPQL超详细介绍与JPA命名规则

陈老老老板

Spring JPA 11月月更

湖仓一体电商项目(十四):实时任务执行流程

Lansonli

湖仓一体电商项目 11月月更

PGL图学习之图神经网络ERNIESage、UniMP进阶模型[系列八]

汀丶人工智能

深度学习 图神经网络 11月月更 GAT

EasyExcel常用API与注解

陈老老老板

EasyExcel java; 11月月更

大厂敲门砖,Github霸榜的顶级并发编程宝典被我搞到手了!

小小怪下士

Java 面试 并发编程 JVM

一文了解 Go 中的指针和结构体

陈明勇

Go golang 指针 结构体 11月月更

信息论与编码:信道的数学模型

timerring

11月月更 信道 数学模型

云原生系列一 【基于CCE Kubernetes编排实战】

叶秋学长

Kubernetes 云原生 CCE 11月月更

@Valid与@Validated的区别

陈老老老板

java; 11月月更

C++---类型萃取---is_integral && is_floating_point

桑榆

C++ STL 11月月更

华为云桌面Workspace,不得不爱的移动办公新体验

爱科技的水月

湖仓一体电商项目(十三):数据发布接口和可视化

Lansonli

湖仓一体电商项目 11月月更

SpringBoot整合MongoDB超详细教程

陈老老老板

java; spring-boot 11月月更

【Java面经】阿里三面被挂!幸获内推,历经5轮终于拿到口碑offer

钟奕礼

Java java面试 java编程 程序员‘

EasyRecovery15数据恢复软件下载使用安装教程

茶色酒

EasyRecovery15

吃透这份“腾讯限量版”Java架构笔记,要个40k不过分吧?

钟奕礼

Java 程序员 java面试 java编程

线上沟通无忧,华为云会议SmartRoom了解一下

清欢科技

python数据分析-pandas增删改查

AIWeker

Python Python数据分析 11月月更

10 W字最新 Java 热门面试题及答案总结

钟奕礼

Java java面试 java编程 程序员 java

看我如何连夜自建网站背刺我的求职对手们

华为云开发者联盟

云计算 华为云 云服务器 自建网站

EasyExcel导出数据超过Excel单表上限解决方案

陈老老老板

EasyExcel java; 11月月更

The Micro-service design of E-commerce System

David

架构实战营

好消息 突破:IM开源项目OpenIM采用wasm技术实现jssdk

Geek_1ef48b

SpringBoot整合Elasticsearch超详细教程

陈老老老板

ES spring-boot 11月月更

GaussDB拿下的安全认证CC EAL4+究竟有多难

华为云开发者联盟

数据库 后端 华为云

2022最全168道Spring全家桶面试题(含答案)

钟奕礼

Java java面试 java编程 程序员‘

从12K到60K,这2023Java研发必问高级面试题,过关斩将拿offer

钟奕礼

Java java面试 java编程 程序员‘

Spring Data JPA简介与SpringBoot整合超详细教学

陈老老老板

Spring JPA 11月月更

湖仓一体电商项目(十二):编写写入DM层业务代码

Lansonli

湖仓一体电商项目 11月月更

云原生系列 二【基于CCE Kubernetes编排实战】

叶秋学长

Kubernetes 云原生 11月月更

  • 扫码添加小助手
    领取最新资料包
LinkedIn是如何优化主页的_语言 & 开发_李小兵_InfoQ精选文章