seo大牛是什么意思 - seo 大全(国内seo大牛)
- 猫先森
- 2026-06-14
- 神马优化技巧
- 220浏览
- 0评论
云栖TechDay活动 第十四期中,来自阿里的云魂给各人 带来了题为《Poplayer》的分享,分享中他重点先容 了手机淘宝在分离稳固 业务和临时 业务所做的一些实行 和探索。
下面是现场分享观点整理。

怎样 分离稳固 业务与临时 业务?
怎样 才华 分离稳固 业务和临时 业务?我们在答复 这个题目 之前,起首 要搞清楚 什么是稳固 业务?什么是临时 业务?
图一 怎样 分离稳固 业务与临时 业务
对于电商应用而言,比方 我们用手机淘宝欣赏 某一款宝贝 时,在详情页面将其添加到购物车,再去购物车结帐,整个买卖 业务 流程黑白 常稳固 的,因此这些详情页面可称为非常稳固 的业务。在详情页面上,买卖 业务 转化率会非常高,由于 用户来到详情页面时,根本 上他买卖 业务 的大概 性就非常大;假如 他只是在什么淘宝头条看一看,他的目标 大概 并不是说看宝贝 ,有大概 只是看一看资讯之类的,如许 环境 下买卖 业务 转化率不是很高。
以是 对于上述详情页面的例子,就可以界说 为稳固 的业务。稳固 就意味着在这上面的代码不可以或许 随意乱改,由于 任意 乱改有大概 会增长 非稳固 性。
什么叫做临时 业务? 对于电商应用而言,谋面 临很多 节日大概 大型促销活动 。这些促销活动 的代码是不大大概 去复用的,比如 说本年 的双11我们有如许 的玩法,来岁 双11大概 又会其他的玩法,这种业务相对非常临时 ,而且根本 上也是属于脑动大开的计划 ,它不会像详情页具有固定的模式。
明白 稳固 业务和临时 业务的概念后,我们要看一下为什么要去解耦它们两个之间的关系:一方面是稳固 性,比如 说我本日 要在详情页面去做一个大型的促销活动 ,直接去乱改详情页的代码,做完促销活动 ,再把原来的代码规复 出来。
如许 为了特定的活动 而反复修改代码将会导致它的稳固 性非常之低,哪怕出现一丁点不对 也会引起买卖 业务 量的下跌;第二个缘故起因 与发版节奏相干 ,在一款电商应用中,临时 业务和稳固 业务开辟 根本 上属于常态化的一种征象 。稳固 的产物 ,它有固定的节奏,比如 说这一周我们应该添加某项功能,下一周应该添加另一项功能,产物 自身具有如许 一种节奏;但是临时 业务正如我刚刚先容 那样,它的筹划 性不像产物 的节奏那样稳固 ,极有大概 是下周举行 一个促销,这周必要 加班举行 研发,团体 的发版节奏就很成题目 。活动 开辟 有活动 开辟 的节奏,产物 开辟 有产物 开辟 的节奏。
一
PopLayer的劈头
图二 Poplayer的劈头
手淘在解耦两者之间的关系的过程中做了非常多的探索。从2014年双11开始,根本 上采取 是Native开辟 。比如 说双11我们要去做一个活动 ,大概 我们会在提前一两个月,Native的同砚 就开始去做开辟 。2015年的双11又换一种新的活动 玩法,这些代码就完全废掉了,对于此次活动 而言,两者之间是完全没有解耦的。从2014年双十二开始,我们实行 了Hybrid的方式,比如 说本日 想在一个详情页去做一个活动 ,我们大概 会在详情页嵌入一个Webview,必要 举行 活动 时,直接调用Webview,在其上写一些相对应的前端代码即可。
实际 上,这种做法是存在弊端 的:一方面,单纯地搭建Webview时,会导致下层页面的隔离特别 大,活动 的板块会覆盖大部分 的详情页面,用户体验不是太好;另一方面,这种做法并没有办理 全部 页面的题目 ,比方 你大概 在详情页必要 嵌如许 一个Webview,在首页又想做如许 一个活动 ,就必要 在首页上再嵌入一个Webview,它没有一套同一 的管理机制。
颠末 连续 探索之后,我们开辟 了一款名为Poplayer的中心 件,专门用于支持活动 营销和非稳固 业务与稳固 业务隔离。 它重要 采取 的是AOP方式,在每次页面切换的时,将Webview嵌入到对方页面当中。以是 说对于详情页开辟 的同砚 ,着实 他并不知道详情页上已经嵌入了Webview;同样地,首页的开辟 同砚 也不知道在首页上也已经嵌入了Webview。如许 做一方面在代码上实现相识 耦;另一方面提供了同一 的机制,多页面嵌入Webview时,无需分离开 来,全部 的场景实现了一次投入重复利用 。对于Poplayer而言,它对变乱 的分发做了一些处理 惩罚 ,在容器层做了一些变乱 处理 惩罚 流程的改变,对弹出的页面举行 了优化,进步 了团体 的用户体验。
总结来说:PopLayer是一个可以在恣意 Native页面(这个页面乃至 可以是Browser)弹出H5的摆设 容器,可以在无需发版的环境 下对已有的Native界面上浮出透明浮层,而且 可以不影响Native页面本身 的交互。PopLayer技能 最紧张 的意义就是:在同一页面上分离稳固 产物 与临时 业务。
下面来看一些PopLayer的Showcase。
图三 PopLayer在手淘中的应用

上面的这三个图是手淘中的三个产物 ,对应于程序而言,它着实 就是三个模块。在这三个图中赤色 线条框内的就是PopLayer,包罗 独占式和非独占式两类,形态多种多样,因此用户着实 是感知不到三者是一个同一 的办理 方案。
图四 利用 PopLayer产生的搜刮 殊效
在双十一活动 时,它还做出来了上图所示的结果 ,即在搜刮 页面产生一些殊效 :比方 ,搜刮 肥皂、冰箱等关键词,会弹出一些彩蛋以及气泡等殊效 。
后续,我们还在双十二年货、手机淘宝发红包等活动 中利用 了PopLayer,用于营造活动 氛围。别的 ,PopLayer除了用于做活动 之外,还会用它来做一些新产物 的试水,比方 淘宝中“问各人 ”产物 中就是利用 PopLayer开辟 的。假如 产物 不乐成 ,就可以直接将该设置 切掉,对于详情页而言,代码不发生任何变动 。
一
PopLayer在双11中的应用
下面我就先容 一下PopLayer在双11中的一些应用。
图五 PopLayer在双十一的应用
在左边的筹划 内和右边筹划 外的各自包罗 了一个PopLayer利用 的案例。筹划 内利用 是指双11之前就已经确定了这些活动 ,投入开辟 ,创造大概 ;筹划 外利用 是指在双11之前是没有想到此类环境 的发生,必要 临时 增长 的活动 以办理 当时 产物 上的题目 ,从而增长 的一些额外利用 。
一
创造大概
图六 利用 PopLayer实现搜刮 殊效
上图所示就是筹划 内的创造大概 ,这里以搜刮 关键字(包罗 气泡、裂屏等关键字殊效 和红包密令)为例对创造大概 举行 讲授 。在阿里电商应用中,尤其像双十一这类非常大型的活动 当中,我们开展活动 极有大概 手机淘宝、手机天猫、聚划算等浩繁 应用上同时举行 举行 ,而非单独各自开展。比方 搜刮 关键字,不管在天猫,还是 在手淘中去搜刮 ,都会出现殊效 关键字大概 红包密令。但是这意味着我们必要 在淘宝iOS、安卓、iPad和天猫iOS、安卓、iPad共6个客户端上都必要 做同样的控件;别的 整场活动 必要 涉及到4个页面,假如 完全采取 Native头脑 ,这个工作量还是 挺大的。
如今 ,搜刮 红包采取 的是PopLayer的计划 流程,在搜刮 框中,输入关键词后点击搜刮 按钮时,会将PopLayer(上图所示的黄色中转页)给拉起来,对于用户而言,它如今 是不可见的,它美满 是 一个透明的东西,可以把它明白 作实行 一段JS逻辑的引擎。由它来决定用户所输入的关键词是否应该出现关键词殊效 大概 红包密令,亦或是正常搜刮 结果 。
假如 要出现关键字红包,是在客户观看完弹出的关键词殊效 之后,主动 出现小红包,点击红包就会跳到对应的商店 页面,出现抽红包的活动 页;别的 要弹出红包密令时,它起首 要判定 输入的关键词是否要弹出红包,然后再举行 红包弹出操纵 。这种做法的上风 在于:由于H5本身 就是跨平台的,前端只要写如许 一份代码就能通过PopLayer这个调治 框架实如今 6个客户端上运行。
一
急速交付
图七 PopLayer在筹划 外的利用
下面再来看一下筹划 外的急速交付,上图中标出了几个时间点,是指在双十一中筹划 之外的活动 ,根据当时 的状态 判定 是否必要 增加 新的促销本领 和额外的活动 。我们开辟 的速率 黑白 常快的,比方 双十一当天,首页有一个“再来一波”的引流,必要 给用户发更大量的红包,进而刺激买卖 业务 量,我们开辟 这个活动 仅仅花了24个小时。整个双十一中,临时 活动 中的75%的活动 是在两小时以内开辟 出来的。
别的 ,由于H5在出题目 后可以及时 地举行 修改代码,立马见效 。因此在临时 活动 中,没有出现BUG,纵然 出现了,在几分钟内也可以办理 。
一
PopLayer的应用场景
图八 PopLayer的应用场景
PopLayer的应用场景上文也有讲到:它支持自界说 的定投,由于PopLayer全透明时用户完全无感知,以是 天生可以完成恣意 逻辑的定投,比方 通过PopLayer区分新老用户来举行 投放差别 的大礼包活动 ;别的 它支持肴杂 开辟 ,由Native完成稳固 的功能,由PopLayer完成多变的业务,比如 春节的打年兽活动 ,通过与Native页面产生一些交互,让用户以为 是首页开辟 的一个活动 ;末了 ,它支持复杂交互,临时 入口可以有交互逻辑。
一
PopLayer的计划
图九 PopLayer的工作流程
上面我们所提到的都是它在业务上的代价 ,这里我们从技能 上看一下它的团体 计划 过程。上图是简化框架图,表现 的是它的工作流程:页面切换时(从首页跳到详情页,如许 的动作界说 为一次页面切换),去远端读取设置 ,判定 对应的切换是否必要 弹出PopLayer,假如 不必要 ,则正常的跳转已往 ;假如 必要 弹出PopLayer,则将对应的Webview加载到Native页面上。固然 这内里 还存在别的 一个逻辑,当用户的点击变乱 到来时,我们会根据他点击的像素点的透明值的分量,与对应的阈值去做判定 ,假如 高出 了阀值,无需拦截它,直接交给H5处理 惩罚 ,用户就点击到H5上的元素;假如 没有高出 这个阈值,则将此次变乱 拦截放弃处理 惩罚 ,将该变乱 交给下层的Native页面做相对应的逻辑。
图十 PopLayer的静态模块
上图是从相对静态、模块化的角度去分析PopLayer的差别 模块。对于上文提到触发机遇 ,PopLayer不但 支持页面切换触发,也会支持用户自界说 发送的消息触发。在生命周期模块,重要 包罗 消息管理、设置 管理以及规则管理。
PopLayer View模块中,最紧张 的是做了点透处理 惩罚 的逻辑,就是用户点击到了透明的地方,可以或许 把变乱 给放行下去,非透明的地方还是 交给H5行止 理 惩罚 ;别的 通过页面加载保障了Webview 的完全加载;别的 还提供了jsbridge API,通过更为安全的逻辑来包管 其可以调用Native的接口形成互动。
由于PopLayer不但 在手淘中应用,同时它还提供给天猫、聚划算等应用。差别 的应用的各自设置 推送、页面导航等细节的处理 惩罚 差别 ,因此,PopLayer提供了一个体系 调治 的界面,内部实现时,各个接入方服从 这一套规范。图中最左边的开辟 调试工具模块也非常 紧张 ,这是由于 PopLayer的开辟 涉及Native、 iOS和安卓以及前端开辟 联调。通过对开辟 调试模块举行 优化,不但 加快 了题目 排查速率 ,同时也与PopLayer主打的急速交付目标 符合 。
一
PopLayer的核心 技能 点
图十一 PopLayer的核心 技能 点
PopLayer的核心 技能 点在上文中也有涉及,这里在举行 总结一下:第一点就是点透本领 ,对于iOS重要 采取 了CGBitmapContextCreate和hitTest(对于Android重要 采取 了View.getDrawingCache()和onInterceptTouchEvent)行止 理 惩罚 点透变乱 的流程,通过获取当前的点击位置的RGBA值,根据透明度判定 是否要在当前webview处理 惩罚 ,或是跳过当前webview。
第二点是坚固 性保障,前端在利用 jsbridge调用display接口后才会真正展示PopLayer,包管 了整个webview表现 的完备 性。
第三点是可扩展性保障,消息方面,双十一期间增长 了timer、自界说 消息、PopLayer协议三种方式;前端方面界说 了大量jsbridge API,满意 各种需求。
福利君来啦!小搭档 们快奔走相告呐~
蚂蚁金服阿 里云
在线金融技能 峰会
8月30日-8月31日
20:00-21:30,线上共聚首
峰集会 会议 程
全开放免费注册,2天夜间技能 交换 、每场1.5小时深度分享、长时间互动 答疑、素材第一时间公开、用户组同步搭建。更有8位技能 大牛线上与你 零间隔 !
[ 08月30日 ] 阿里技能 架构演变,及基于EDAS的灵敏 服务开辟 与架构实践
[ 08月30日 ] 付出 宝亿级APP的性能稳固 性优化及运维实践
[ 08月30日 ] 蚂蚁开放平台技能 蹊径 及行业实践
[ 08月30日 ] 云数据库OceanBase的架构演进及在金融核心 体系 中的实践
[ 08月31日 ] 云数据库体系 容灾架构计划 和实战
[ 08月31日 ] 大规模呆板 学习在蚂蚁+阿里的应用
[ 08月31日 ] 万人低头期间 ,付出 宝APP无线网络性能该怎样 保障
[ 08月31日 ] 蚂蚁金服大数据开放式创新实践
扫码直入报名页:
点击“阅读原文”,直达报名页哟!
本站文章除注明转载/出处外,均为本站原创或翻译。若要转载请务必注明出处,尊重他人劳动成果共创和谐网络环境。
转载请注明 : 文章转载自 » 猫先森社圈 » 神马优化技巧 » seo大牛是什么意思 - seo 大全(国内seo大牛)