ROG游戏手机2京喜用户量再次喜提新升级,各位都更了吗

发改委“数字化转型伙伴行动”啟动 “京东新动力计划”发布

费帮助中小企业数字化转型比如,为十万家中小微企业客户提供基于京东资源供应链结构、企业采购SaaS的┅系列数字化采购、供应链管理和产品解决方案。针对不敢转的问题提供云基础设施服务及大量SaaS的解决方案,使企业在塑造转型过程中不仅有数字化转型的基础设施可用,还可以获得不同类型的产品和解决方案
技术惠捷 帮助福清食品企业降本增效
“京东新动力计划”其实是京东智联云基于长期服务各类产业场景不同类企业的实践积累和京东“技术惠捷”的技术理念,使不同规模的企业都能够更高效、哽便捷、更平等地获取技术和服务赋予企业新的驱动力。这在帮助福清食品企业降本增效享受协同效益的过程中展现得淋漓尽致。
福建福清具有覆盖全球的海鲜供应链的产业基础在全球有超过4000家从事海鲜和食品相关的小微企业,无论是国外进口还是国内销售都是传统嘚线下渠道模式突如其来的新冠疫情使福清食品行业海外订单呈现断崖式下降,大量外向型企业面临生存危机京东智联云为福清搭建起基于食品行业面向B端和C端流通的“京东元洪食品展示交易公共服务平台”,通过该平台使得整个产业链上所有的生产采购、销售、供應,都有数字化小程序和手机app助力同时,基于智能供应链该平台通过人工智能、云计算、大数据等技术进行匹配、调配和运输,极大提升了其全球海鲜供应链的市场效率
对于中小微企业,京东智联云依托京东集团优势结合在云计算、人工智能、物联网、大数据等方媔的技术和资源,不仅可以提供底层云设施、降低转型门槛让中小微企业降本增效,还可以凭借智能供应链的超级生态带动上下游产業链,让中小微企业享受协同效益
“京东新动力计划”具体行动内容如下:

本文阅读时长约15分钟京喜小程序开发团队核心成员倾力之作,都是干货读完一定会收获满满,请大家耐心阅读~

京喜小程序自去年双十一上线微信购物一级入口后時刻迎接着亿级京喜用户量量的挑战,细微的体验细节都有可能被无限放大为此,“极致的页面性能”、“友好的产品体验” 和 “稳定嘚系统服务” 成为了我们开发团队的最基本执行原则

首页作为小程序的门户,其性能表现和京喜用户量留存率息息相关因此,我们对京喜首页进行了一次全方位的升级改造从加载、渲染和感知体验几大维度深挖小程序的性能可塑性。

除此之外京喜首页在微信小程序、H5、APP 三端都有落地场景,为了提高研发效率我们使用了 Taro 框架实现多端统一,因此下文中有部分内容是和 Taro 框架息息相关的

提起互联网应鼡性能这个词,很多人在脑海中的词法解析就是“是否足够快?”似乎加载速度成为衡量系统性能的唯一指标。但这其实是不够准确嘚试想一下,如果一个小程序加载速度非常快京喜用户量花费很短时间就能看到页面的主体内容,但此时搜索框却无法输入内容功能无法被流畅使用,京喜用户量可能就不会关心页面渲染有多快了所以,我们不应该单纯考虑速度指标而忽略京喜用户量的感知体验洏应该全方位衡量京喜用户量在使用过程中能感知到的与应用加载相关的每个节点。

谷歌为 Web 应用定义了以京喜用户量为中心的性能指标体系每个指标都与京喜用户量体验节点息息相关:

其中,“是否有用” 这个问题是非常主观的,对于不同场景的系统可能会有完全不一樣的回答所以 FMP 是一个比较模糊的概念指标,不存在规范化的数值衡量

小程序作为一个新的内容载体,衡量指标跟 Web 应用是非常类似的對于大多数小程序而言,上述指标对应的含义为:

  • FCP:白屏加载结束;
  • FMP:首屏渲染完成;
  • TTI:所有内容加载完成;

综上我们已基本确定了高性能的概念指标,接下来就是如何利用数值指标来描绘性能表现

小程序官方针对小程序性能表现制订了权威的数值指标,主要围绕 渲染表现、setData 数据量、元素节点数 和 网络请求延时 这几个维度来给予定义(下面只列出部分关键指标):

  • 首屏时间不超过 5 秒;
  • 渲染时间不超过 500ms;
  • 貌似非常轻松地完成需求但值得思考的是:如果组件顺序调整了,所有组件的生命周期会发生什么变化

    'icon-nav']。经实验得出当某个组件节點发生变化时,其前面的组件不受影响其后面的组件都会被销毁重新挂载。

    原理很简单每个组件都有各自隔离的节点树(ShadowTree),页面 body 也昰一个节点树在调整组件顺序时,小程序框架会遍历比较新/旧节点树的差异于是发现新节点树的 nav-bar 组件节点不见了,就认为该(树)分支下从 nav-bar 节点起发生了变化往后节点都需要重渲染。

    但实际上这里的组件顺序是没有变化的,丢失的组件按道理不应该影响到其他组件嘚正常渲染所以,我们在 setData 前先进行了新旧组件列表 diff:如果 newList 里面的组件是 oldList 的子集且相对顺序没有发生变化,则所有组件不重新挂载除此之外,我们还要在接口数据的相应位置填充上空数据把该组件隐藏掉,done

    通过组件 diff 的手段,可以有效降低视图层的渲染压力如果有類似场景的朋友,也可以参考这种方案

    想必没有什么会比小程序 Crash 更影响京喜用户量体验了。

    当小程序占用系统资源过高就有可能会被系统销毁或被微信客户端主动回收。应对这种尴尬场景除了提示京喜用户量提升硬件性能之外(譬如来京东商城买新手机),还可以通過一系列的优化手段降低小程序的内存损耗

    小程序提供了***内存不足告警事件的 API:wx.onMemoryWarning,旨在让开发者收到告警时及时释放内存资源避免尛程序 Crash然而对于小程序开发者来说,内存资源目前是无法直接触碰的最多就是调用 wx.reLaunch 清理所有页面栈,重载当前页面来降低内存负荷(此方案过于粗暴,别冲动想想就好...)。

    不过内存告警的信息收集倒是有意义的我们可以把内存告警信息(包括页面路径、客户端版夲、终端手机型号等)上报到日志系统,分析出哪些页面 Crash 率比较高从而针对性地做优化,降低页面复杂度等等

    根据双线程模型,小程序每一个页面都会独立一个 webview 线程但逻辑层是单线程的,也就是所有的 webview 线程共享一个 JS 线程以至于当页面切换到后台态时,仍然有可能抢占到逻辑层的资源譬如没有销毁的 setIntervalsetTimeout 定时器:

    即使如小程序的 <swiper> 组件,在页面进入后台态时依然是会持续轮播的

    正确的做法是,在页面 onHide 嘚时候手动把定时器清理掉有必要时再在 onShow 阶段恢复定时器。坦白讲区区一个定时器回调函数的执行,对于系统的影响应该是微不足道嘚但不容忽视的是回调函数里的代码逻辑,譬如在定时器回调里持续 setData 大量数据这就非常难受了...

    避免频发事件中的重度内存操作

    我们经瑺会遇到这样的需求:广告曝光、图片懒加载、导航栏吸顶等等,这些都需要我们在页面滚动事件触发时实时***元素位置或更新视图茬了解小程序的双线程模型之后不难发现,页面滚动时 onPageScroll 被频发触发会使逻辑层和视图层发生持续通信,若这时候再 “火上浇油” 调用 setData 传輸大量数据会导致内存使用率快速上升,使页面卡顿甚至 “假死”所以,针对频发事件的***我们最好遵循以下原则:

    • 避免 CPU 密集型操作,譬如复杂的计算;

据 小程序官方文档 描述大图片和长列表图片在 iOS 中会引起 WKWebView 的回收,导致小程序 Crash

对于大图片资源(譬如满屏的 gif 图)来说,我们只能尽可能对图片进行降质或裁剪当然不使用是最好的。

对于长列表譬如瀑布流,这里提供一种思路:我们可以利用 IntersectionObserver 监聽长列表内组件与视窗之间的相交状态当组件距离视窗大于某个临界点时,销毁该组件释放内存空间并用等尺寸的骨架图占坑;当距離小于临界点时,再取缓存数据重新加载该组件

然而无可避免地,当京喜用户量快速滚动长列表时被销毁的组件可能来不及加载完,視觉上就会出现短暂的白屏我们可以适当地调整销毁阈值,或者优化骨架图的样式来尽可能提升体验感

小程序官方提供了一个 长列表組件,可以通过 npm 包的方式引入有兴趣的可以尝试。

结合上述的种种方法论京喜小程序首页进行全方位升级改造之后给出了答卷:

2. 优化後的首屏渲染完成时间(FMP):

3. 优化前后的测速数据对比:

然而,业务迭代在持续推进多样化的京喜用户量场景徒增不减,性能优化将成為我们日常开发中挥之不去的原则和主题本文以微信小程序开发中与性能相关的问题为出发点,基于小程序的底层框架原理探究小程序性能体验提升的各种可能性,希望能为各位小程序开发者带来参考价值

  • 京喜首页(微信购物入口)跨端开发与优化实践

欢迎关注凹凸實验室博客:aotu.io

或者关注凹凸实验室公众号(AOTULabs),不定时推送文章:

10 月 31 日京东旗下社交电商平台京囍正式接入微信一级入口,消费者只需点击 " 微信 - 发现 - 购物 " 即可访问京喜这也宣告着京喜在微信一级入口、手机 QQ、京喜小程序、京喜 APP、京囍 M 站、粉丝群 6 大移动端渠道完成全域战略布局。

事实上在今年京东二季度财报***会议中京东零售集团轮值 CEO 徐雷就曾表示,京东将在十朤一号前后升级与腾讯合作的微信一级入口的资源打造一个针对微信生态,尤其是女性和低线市场的新模式恰逢京东 11.11 的重要促销活动節点—— " 全民京喜日 ",首次参加京东 11.11 的京喜以漂亮的***让外界感受到了社交电商的独特魅力:开启还不到一个小时,京喜销量即突破 100 万单;全天共卖出近 6000 万件商品其中,工厂直供订单量环比增长 16 倍补贴爆款深受用户喜爱。此外京喜新京喜用户量占当日京东全站噺京喜用户量的比例达 42%,来自 3-6 线下沉新兴市场的新京喜用户量占当日京喜新京喜用户量的 74%拉新效果和开拓下沉市场的能力异常显著。

京囍正式接入微信一级入口  

京东社交电商布局迈出跨越性一步

京喜是京东以全面升级的拼购业务为核心以微信一级入口为主要载体,基于陸大移动端渠道打造的全域社交电商平台

随着人口红利的逐步消退,电商行业的获客成本不断提高社交电商凭借社交分享快速触达消費人群、以及契合下沉新兴市场 " 熟人社会 " 消费习惯的优势,成为电商行业新风口在这一领域,京东并非后来者

2014 年京东与腾讯战略合作後,腾讯就为京东开放了微信一级入口合作后,京东并非只把微信当作购物入口和引流工具而是通过全方位的布局不断挖掘社交渠道嘚价值。2016 年京东开始布局社交电商,启动京东拼购京东的社交电商布局并未急于求成,而是致力于成为 " 低价不低质 " 的新型社交电商┅方面依托于京东主站的品控优势,打磨京东拼购的品控流程另一方面基于微信社交场景,前瞻性地构建了集社交玩法内容营销及拼購三位一体的社交生态。

今年京东打造了区别于京东主站现有场景和模式的全新平台——京喜,于 9 月 19 日正式上线京喜聚焦于下沉新兴市场消费人群,通过高质价比好货及丰富的社交玩法与京东主站实现了 " 人 "、" 货 "、" 场 " 的差异化互补。

京东零售集团 CEO 徐雷曾表示这是京东罙度挖掘微信市场、拓展三到六线城市京喜用户量的重要手段。

而今京喜正式接入微信一级入口,标志着京东在社交电商布局上迈出跨樾性一步京喜将以工厂直供的低价好货,结合沉浸式泛娱乐化的互动购物体验进一步深耕微信市场,把质优价美的商品带给更庞大的丅沉新兴市场消费人群

京喜借助三大优势  

连接工厂好货与下沉新兴市场消费人群

微信一向被视为下沉市场最好的入口。京东零售集团社茭电商业务部京喜运营总经理冯燕认为京喜有三大独特优势——填平信息鸿沟、打掉价格差、坚持货是王道。接入微信一级入口后京囍将获得发展的加速器,在六大移动端渠道的加持下持续挖掘下沉新兴市场京喜用户量的需求,触达更广泛的消费群体

京喜的第一大優势是填平信息鸿沟。在下沉新兴市场的线下商业中普遍存在商店分布相对分散、销售种类有限、商品流通环境复杂多样等情况,导致商品定价不规范京喜正在填平下沉新兴市场消费者与一二线城市消费者之间的信息鸿沟,消除信息不对称实现了下沉新兴市场与一二線城市线上购物体验的一致。

京喜的第二大优势是打掉价格差基于对下沉新兴市场消费人群需求的深刻理解,京喜主攻工厂直供、高频ㄖ用品、品牌特卖这三类货品将优质低价的产品通过平台整合,直接对接给京喜用户量满足下沉新兴市场消费升级的需求。京喜正在整合全国产业带的厂商资源从货品源头端定制商品、挑选好货,砍掉流通中间渠道缩减流通成本,打掉多出来的价格差实现厂商多賣货、京喜用户量少花钱。

京喜的第三大优势是坚持货是王道给京喜用户量提供真正需要的货品,用更适合京喜用户量、与京喜用户量消费能力和需求精准匹配的好货赢得京喜用户量信赖目前国内分布着众多优质产能,若能将这些产业带的优质产品与消费者之间的通道咑开不仅能为厂商打开更广阔的市场,也能让消费者获得更多优质实惠的商品将优质产能、以及更有针对性的商品对接给下沉新兴市場消费人群,是京喜的核心定位和独特优势所在

京喜上线后,借助三大优势越来越被更多下沉新兴市场京喜用户量熟知和喜爱。在 10 月 31 ㄖ " 全民京喜日 "京喜新京喜用户量占当日京东全站新京喜用户量的比例达 42%,来自 3-6 线下沉新兴市场的新京喜用户量占当日京喜新京喜用户量嘚 74%拉新效果和开拓下沉市场的能力异常显著。从整体京喜用户量层面上看近七成京喜用户量来自 3-6 线下沉新兴市场,河南焦作武陟县、屾东枣庄滕州市、河南郑州新密市是京喜新京喜用户量数量增长最多的三个地区。

京喜带领 100 个产业带玩转京东 11.11

目前京喜已布局全国 100 个產业带,深耕产业带是京喜未来发展的重要战略之一在京东 11.11 期间,从 10 月 18 日到 10 月 30 日京喜每天推出一个产业带特色专场,提供产业带整合營销方案将更多实惠的工厂直供好货对接给广大京喜用户量,带动了核心厂商订单量环比提升 770 倍

在 10 月 31 日 " 全民京喜日 ",来自四川成都纸品产业带的竹浆抽纸全天卖出 293 万件;来自福建泉州食品产业带的软吐司面包,卖出超过 100 万包;来自浙江义乌日用品产业带的洗碗巾卖絀超过 50 万条……从整体数据上看,工厂直供的订单量环比增长 16 倍

而在整个京东 11.11 期间,京喜正联合厂商提供巨额补贴实现真正击穿行业底价,据悉京喜已联合厂商备货超过亿件 1 元爆款商品,供消费者抢购同时,京东自有实验室快检和第三方神秘抽检今年累计检测商品超过 2 万批次,全面保障消费安全

对于未来的发展,京东集团副总裁、京东零售集团平台业务中心负责人韩瑞表示检验京喜是否成功茬于它能够帮助京东主站在下沉新兴市场上获取多少新京喜用户量,因此京喜用户量的口碑和留存是验证成功的关键标准。从 " 京喜日 " 反饋的成绩来看京喜用户量对京喜的认可度是比较高的。随着微信一级入口的接入未来京喜将实现对下沉新兴市场消费人群更为广泛的覆盖。

在 8 月 29 日的深圳机场第四届 AMIC 阿拉丁小程序创新大会组委会的小伙伴们拖着疲惫的身体,躺在深圳机场的躺椅上边放空、边等待回京嘚晚点飞机没人张嘴说话。在一片沉默中有同事弱弱地提出一个问题:咱们 4 月、8 月两场创新大会办完了,年底的第三届全球小程序生態大会该怎样才办得更好、更加与众不同呢

讲真,所有人都睁开了眼睛互相对视之后开始思考。原以为漫长难熬的两小时竟然就这樣在大家你一句我一句、疲倦又难掩兴奋的讨论声中很快过去了。

自此我们一直在讨论该如何定义年底全球小程序生态大会,这是一场哽大规模、极具创新意识的大会这次的主题确实真的要好好商量。直到 9 月底小编跟小程序从业者们在社群里聊天的时候,忽然灵光一現既然这个问题还没有定论,那不如就交给我们小程序从业者朋友们做主吧

小编和市场公关小伙伴们联系了 100 多位小程序行业创业者,唏望了解在他们眼中 2019 小程序是怎样的这一年里,他们与小程序又有哪些新的故事小编发现,每每谈及如何看待小程序的现在及未来電话那端的声音会明显变得兴奋,而说到「The Next」这个主题时话匣子一下子就被打开了。

因为小程序从 2017 年 1 月 9 日面向 C 端京喜用户量我们创始囚史文禄曾定义小程序真正上线的日子应该是在 2017 年 12 月 28 日,小程序在一年半的时间开启了一个波澜壮阔的新时代「The Next」代表着中国互联网的丅一个时代。同程艺龙在小程序上用一年时间再造了一个同程艺龙面向中老年京喜用户量的内容类小程序小年糕 +、票圈长视频只用一年時间便取得 DAU 超 1000 万的好成绩,兴盛优选只用半年时间就定义了小程序社区团购的赛道完成今年交易 GMV 破 100 亿的奇迹。小游戏、企业协同办公、視频类小程序也分别有各自的优秀代表

小程序的超能力被行业看到和认同,这个新时代变得触手可及阿拉丁和小程序从业者也终于敢於使用确定语「The Next」来定义它,同时我们难以想象小程序的未来和终点会在哪里不确定它最终会开拓出怎样的新时代,所以请容许我们在苐三届全球小程序生态大会的主题里融入我们对小程序的所有想象和期待

「The Next」是目前我们对小程序和第三届全球小程序生态大会能给出嘚最好的定义。

我们才华横溢的 UI 小伙伴为此设计了几个风格迥异的主题视觉效果图一时间公司内部竟难以抉择。还请各位朋友给点儿建議你更喜欢哪一个?

工具条上可以设置滑动高度默认 240px。

设置滑动序列:直接拖动内容到布局里面就可以

调整前后顺序:直接拖就可鉯。

比左右滑动的编辑要方便不少

第三届全球小程序生态大会门票火热抢购中,戳「阅读原文」立即开抢!

参考资料

 

随机推荐