百度技术沙龙第82期回顾:移动时代的搜索体验:百度搜索Web前端技术解析

从Web诞生到如今,Web前端技术已经逐步成长为一个丰富且有活力的技术世界。随着互联网行业发展格局的频繁演进以及产品策略的不断调整,不同阶段的业务在技术选型、前端性能优化、用户交互体验上不断产生新的需求,不断地对 Web 前端技术提出新的要求。

百度作为国内主流的搜索引擎,不断深耕搜索和互联网技术,Web前端技术在搜索引擎的体验提升中扮演了重要角色。在移动搜索时代,百度搜索Web前端技术从用户交互体验出发,提出了移动搜索的体验标准,在此之上,一方面不断强化和提升搜索引擎产品本身的效果和体验;另一方面,将技术及方法归纳沉淀,为搜索下游的开放Web站点提供了用户体验的标准及量化工具以及提升体验的整体技术解决方案。

10月27日,82期百度技术沙龙,邀请了数位百度前端技术部Web前端资深研发工程师,从 Web 前端技术出发,通过五个主题,立足现在面向未来,由内到外的分享百度在搜索组件化的探索、搜索体验增强、开放Web速度优化及开放Web未来发展发面的技术沉淀和积累。

本期讲师介绍

  • 主题一:搜索组件化的探索与实践

    讲师介绍:陈骁,现任百度前端技术部资深研发工程师,负责 Atom 组件化渲染框架的研发。2015年毕业于浙江大学,毕业后在百度参与了商业知心、语音搜索、百度畅听等多个产品的前端研发工作,对各个前端框架,以及前端组件的设计和实现,都有较丰富的经验。目前负责百度搜索组件化渲染框架 Atom 的研发,参与搜索团队前端基础技术方向上的工作,致力于进行搜索前端技术的革新。

    主题摘要:随着持续深耕的业务需求,以及移动互联网时代对 Web 前端交互体验的更高要求,百度搜索亟需进行一次前端组件化的改造,以提升开发效率。 在搜索这个庞大的架构中,渲染是最后一个环节,它对渲染框架的稳定性以及性能,特别是在服务器端渲染的性能有着非常苛刻的要求。这决定了我们不能只是把一个现有的框架直接拿过来用,而是需要因地制宜,进行很多的探索和优化。本次演讲,将针对优化过程中的问题,包括前后端同构的实现、服务器端渲染性能、前后端渲染一致性,分享百度 Atom 项目中相关的解决方案。

    听众受益:1. 了解搜索组件化的技术选型
                      2. 获取前后端同构的实现方案
                      3. 学习服务器端渲染性能优化的思路

  • 主题二:移动体验标准化建设

    讲师介绍:刘浪宇,百度前端技术部资深研发工程师。2014年加入百度,现致力于 Web 用户体验方面的探索与实践。

    主题摘要:极致的用户体验是 Web 产品所追求的,如何做到好的体验,首先需要有一套清晰的体验指导标准,然后再去落地。本次分享将从抽象层阐述好的体验所涉及到的各个方面,还将介绍如何从技术的角度去衡量 Web 体验的好坏,以及体验标准化体系的具体构成。

    听众受益:1.了解什么是好的用户体验
                      2. 学习如何去量化用户体验

  • 主题三:基于 Custom Elements 标准组件化方式构建 Web 应用

    讲师介绍:邹淼江,百度前端技术部资深研发工程师,2013 年加入百度,目前在前端技术部主要负责 Web 生态相关的工作,是开源项目 MIP 和 Lavas 的核心开发者。长期关注并致力于 Web 性能优化和用户体验提升方面的研究和实践。

    主题摘要:本次分享我们将了解到从技术的角度是如何保证一个 Web 站点是体验良好的,在保证体验之后我们又是如何让一个 Web 站点的体验是可被检测,我们还将了解到基于 Custom Elements 标准组件化构建站点的理念,最后我们会在实践的角度来看可以了解到如何使用 MIP 技术高效快速的构建基于组件化的富应用 Web 应用。

    听众受益:1. 了解如何高效快速的构建一个体验良好的 Web 应用
                      2. 了解基于 Custom Elements 标准的组件化设计如何提升用户端体验和开发效率
                      3. 了解 MIP 技术

  • 主题四:搜索落地页体验技术及应用

    讲师介绍:李兆明,百度前端技术部高级研发工程师。2015 年加入百度,负责部分百度搜索结果页的研发工作,主要关注百度搜索结果落地页体验优化技术的研发与实践、页面加载性能、用户交互体验等方向。

    主题摘要:如何更快、更好地将各类搜索结果页面传递到用户端一直以来是百度搜索前端的核心关注点,而其挑战来自于各个方面:搜索的性质意味着必须传递各种各样的页面,而站长页面性能良莠不齐;搜索本身作为一个网页对浏览器的控制心有余而力不足;除了让页面加载更加迅速,我们还希望让页面加载得更加流畅,体验更加顺滑。本次分享将带大家了解百度如何从搜索结果页加载第三方页面,并使得用户拥有更稳定、更顺畅的体验。

    听众受益:1. 如何更快地加载一个页面
                      2. 如何使页面切换的体验更加流畅
                      3. 如何更安全地加载第三方页面

  • 主题五:如何通过 Lavas 快速构建 PWA 站点

    讲师介绍:王轶盛,百度前端技术部资深研发工程师,负责 Lavas 解决方案的开发和升级维护,以及 PWA 在线课程的制作。积极参与前端技术的分享,新晋前端科普小写手。

    主题摘要:PWA(Progress Web App)是 WEB 未来的发展方向。从体验上来说,PWA 接近原生 APP,通过 Manifest 技术允许用户快速打开站点并获得沉浸式的体验,通过 Service Worker 能够做到资源预加载和离线可用等从而提升性能和可用性;同时 PWA 又拥有 Web 站点的共同优势:免安装和自动更新。
    本次分享将介绍 Lavas 解决方案,帮助中小站点以较小的成本快速搭建一个 PWA 站点。开发者无需关注 PWA 各项技术的实现细节,只需要进行适量的配置即可获得 PWA 的功能,大大简化开发复杂度,给用户提供更好的使用体验。此外也将涵盖 Service Worker 和常用的网页缓存策略及其使用场景。

    听众受益:1. 了解移动 WEB 和 APP 的优劣以及 Web 的发展方向:PWA。
                      2. 通过 Lavas 搭建 PWA 站点
                      3. 了解 Lavas 的内部实现以及解决问题的思路
                      4.掌握 Service Worker 的常规写法和如何为自己站点选择合适的缓存策略

     

内容回顾

    • 高深:百度技术沙龙超级棒。@InfoQ

    • Warning: 都是干货。@InfoQ

    • 徳晨:讲师很棒,思路清晰,学习了@InfoQ

    • #命中you¥:#百度技术沙龙#希望多多举行这样的分享会,支持支持,前路漫漫,我们还有很长的路要走,希望百度引领我在技术的道路上越走越远。@InfoQ


现场图片展示

  • 签到环节
  • 签到礼品
  • 火爆的现场
  • 82期百度沙龙完满谢幕
                                
                                          

 

                                
                                          

 

-->