【AICon】探索RAG 技术在实际应用中遇到的挑战及应对策略!AICon精华内容已上线73%>>> 了解详情
写点什么

百度技术沙龙第 57 期回顾:新时代的前端(含资料下载)

  • 2014-12-26
  • 本文字数:2091 字

    阅读完需:约 7 分钟

2014 年 12 月 21 日,在由百度主办、InfoQ 负责策划组织和实施的第 57 期百度技术沙龙活动上,百度移动云事业部资深研发工程师张袁炜分享了如何将原生能力融入到WebApp 中,独立开发者郭宇分享了Node.js 的应用场景和存在的问题。本文将对这两个分享做一下简单的回顾,同时提供相关资料的下载。

主题一:Blend:融入原生能力到WebApp **(下载讲稿)**

为什么选择WebApp 作为开发方案呢?首先,天下武功,唯快不破。WebApp 可以随时更新,而一个原生App 的更新周期大概在14 天左右。其次,WebApp 的开发成本低,用原来的网页开发人员写一个移动端跑的网页即可,不用组建新的开发团队。

性能是WebApp 的软肋。另外,WebApp 缺乏端能力,不能适应复杂的应用场景。比如,不能说打开浏览器扫描下二维码。

如果有一种解决方案,能够融合Web 的灵活性(包括迭代速度和开发成本)和原生的能力,再加上一些原生能力,这是非常不错的。这就是HybridApp 解决方案。

业内目前已经有一些方案。比如Phonegap,它支持的平台很全面。但是全平台支持的代价是,API 数量不足。还有一个缺点是性能低下,没有对交互和用户体验做优化,导致体验很差。

再比如Titanium,可以编译成原生应用运行,但是学习成本高,要学习它的API 和架构;系统比较复杂,使用人数也很少,大概在整个市场份额里面只有5% 不到。

业内认知度比较高的HybridApp 方案,由于存在不少问题,所以百度的开发团队希望造一个不一样的轮子——希望提供一个提高性能、有融合能力的HybridApp 解决方案,这就是Blend。

Blend 的目标有三:

  • 性能
    • 又包括三个方面,一是转场动画,让它实现比较好的效果,跟原生 App 类似;二是离线缓存,避免在没有 WIFI 或没有网络的时候打开缓慢或报错;三是以原生方式提供一些组件,方便用户。
  • 能力
    • 比如说端能力,把它包装出来在 WebAPP 上面使用。再就是云能力,把百度的云服务封装成 API 开放给 WebApp。第三个是 UI 能力,比如说要做转场动画,在 WebApp 上面很难做到,必须用原生支持。
  • 易用性
    • 因为这相当于要求开发者完全抛弃掉之前的开发理念,然后重新接受一套全新的东西,这会导致推广很难,而且开发者学习起来成本也很高。所以 Blend 在易用性上有几个目标:一是渐进增强,比如有一个纯 WebApp,现在想把它弄成一个交互性更好的原生 App,只需要加一行配置或者是用某种方式去告诉框架。API 能简化就简化配置,在易用性上做了 Meta 扩展。另外就是推出一整套框架,让大家用的时候,只需要写自己的逻辑代码就可以了。

有了设计目标,回到关键点,性能、转场动画到底怎么实现。

张袁炜以百度文库的 WebApp 为例,介绍了转场动画的实现。刚才说了我们要解决的是刚才当 Blend 发现用户点击页面中某个链接,这个页面即将被刷新时,就去初始化 WebView,并且把它放在当前 View 的右边,遮住下面的层。其实里面的内容全都是 Web 的,但是转场的效果和动画是用纯原生方式来实现的。

在 Web 交互中,非常卡的东西用原生方式实现,其他所有的交互和开发用纯 Web 语言来降低开发成本。

接下来张袁炜介绍了开发 Blend 的过程中遇到的问题,以及相应的解决方案和思路。

首先是优雅降级和渐进增强。优雅降级,意思是做一个最强的方案出来,然后针对差一点的手机做一个降级的方案。渐进增强是针对最基础的环境来做,然后再在更高级的浏览器上提高的交互性能。

Blend 提供了一整套一站式服务,里面有很多组件,方便开发者使用。设计 API 的一个思路就是“简单就是美”。因为很多现有的框架很重,或者功能很强大,但是要学习可能就得花十天半个月,这样的框架可能叫好不叫座,所以要考虑简化开发者的学习成本。

Blend 的架构如下图所示:

从下往上来看,Blend 会支持三个平台,一个是 iOS,一个是 Android,还有一个就是纯的浏览器。首先说 iOS 或者 Android,可以在上面开发一个 Runtime,把原生的能力通过 js 的封装,把它的接口暴露出来给上面的 js 或者是页面调用。这是 Native 层,是用原生代码开发的。上面是 JsAPI,这一层提供了很多能力和很多交互组件供开发者使用。再上面就是 HTML API。

主题二:Node.js As Infrastructure——谈谈 Node.js**(下载讲稿)**

Node.js 的成长速度非常惊人,而且受到广泛的技术市场的认可,同时在国内外的公司也得到了广泛的应用。

郭宇结合自己的经验,介绍了 Node.js 的优势:

  • 前后端统一的设计提升代码复用度
  • 众多的开源模块降低开发成本
  • 支持高 IO Web 服务成本低
  • JavaScript 程序员还是蛮多
  • 部署简单方便,版本与环境可控
  • 处于升温状态的市场,广受支持

但 Node.js 也有一些劣势:

  • 编程模型复杂
  • 异步流程控制繁琐
  • Error Handle 成本高
  • 优秀的 JavaScript 程序员很少
  • 不适用于计算密集型应用
  • 社区规范、API 变动频繁

之后郭宇分享了自己的一些经验:

  • 如果你的团队成员小于 3 人,用!
  • 如果你的产品在起步阶段(A 轮前),用!
  • 如果你有 1 位以上优秀的 JS 程序员,用!
  • 如果生产环境主要用其他语言,不要尝试迁移
  • 放心的使用 Node.js 编写内部系统
  • 在熟悉之前,别让前端工程师触碰业务逻辑

演讲之后的圆桌讨论环节,参会者可以和讲师近距离交流,气氛非常热烈。演讲的详细内容,可以关注我们在网站上发布的演讲视频。

2014-12-26 12:291083
用户头像
臧秀涛 略懂技术的运营同学。

发布了 300 篇内容, 共 129.6 次阅读, 收获喜欢 34 次。

关注

评论

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

有数BI大规模报告稳定性保障实践

网易数帆

大数据 BI 网易 稳定性保障

前端工程化之FaaS SSR方案​

百度Geek说

前端

GaussDB(DWS) NOT IN优化技术解密:排他分析场景400倍性能提升

华为云开发者联盟

数据库 GaussDB(DWS) 排他分析 NOT IN

druid 源码阅读(八)Druid 回收连接

爱晒太阳的大白

5月月更

钱卫宁:开源是培养数据库人才的关键|OceanBase 数据库大赛访谈

OceanBase 数据库

oceanbase 数据库大赛

Redis io多线程

C++后台开发

redis 后端开发 Linux服务器开发 C++后台开发 单线程

解锁户外降温黑科技,图拉斯新品发布会完美收官

Geek_2d6073

大前端技术的边界在哪里?

博文视点Broadview

自建Gitlab迁移工具使用指南

阿里云云效

云计算 阿里云 gitlab 代码迁移 代码库

银行RPA趋向主动触发流程,补足营销场景执行末端的渠道协同能力

易观分析

银行 市场营销

Nebula Graph|如何打造多版本文档中心

NebulaGraph

数据库 图数据库 NebulaGraph

堡垒机4a认证是什么意思?是指哪4a?

行云管家

云计算 网络安全 堡垒机 堡垒机认证

互联网出海企业数据库选型问答实录

OceanBase 数据库

云数据库 oceanbase 互联网出海

密码学系列之:PKI的证书格式表示X.509

程序那些事

Java 密码学 程序那些事 5月月更

一图详解java-class类文件原理

华为云开发者联盟

Java JVM class 类文件

Jmeter高手进阶-脚本增强

伤心的辣条

Python 程序人生 软件测试 IT 自动化测试

2022年5月中国数据库排行榜:openGauss 黑马首登顶,AntDB 冲进20强

墨天轮

数据库 opengauss TiDB oceanbase 神通

对话ACE第三期有奖调研

OceanBase 数据库

数据库 对话ACE Oracle ACE

龙蜥开发者说:我的操作系统之路,坚持从实践中来,到实践中去 | 第6期

OpenAnolis小助手

Linux 开源 操作系统 龙蜥社区 龙蜥开发者说

Hoo研究院 | 币圈后浪—PRISM

区块链前沿News

Hoo

CRM系统帮助企业有影响力的营销

低代码小观

CRM 客户关系管理 企业管理系统 CRM系统 客户关系管理系统

javascript 中搜索数组的四种方法

CRMEB

【云计算】云计算四个必学知识看这里!

行云管家

云计算 云服务 企业上云

宜搭小技巧|海量数据管理难?这招帮你事半功倍

一只大光圈

钉钉宜搭

共享自助洗车多少钱一次?怎么收费

共享电单车厂家

自助洗车加盟 自助洗车多少钱一次 共享自助洗车多少钱 自助洗车怎么收费

为什么越来越多人选择自助式洗车

共享电单车厂家

自助洗车加盟 车白兔自助洗车 自助式洗车

OpenHarmony 3.1 Release版本关键特性解析——Enhanced SWAP内存管理

OpenHarmony开发者

内存管理 OpenHarmony

金融任务实例实时、离线跑批Apache DolphinScheduler在新网银行的三大场景与五大优化

Apache DolphinScheduler

Apache 大数据 开源 DolphinScheduler workflow

爱番番微前端框架落地实践

百度Geek说

前端

弱网优化,GCC 动态带宽评估算法(内附详细公式)

融云 RongCloud

通信系统 链路 网络管理

6元自助洗车既能省钱还能赚钱?

共享电单车厂家

自助洗车加盟 6元自助洗车 车白兔自助洗车

百度技术沙龙第57期回顾:新时代的前端(含资料下载)_架构/框架_臧秀涛_InfoQ精选文章