用Weex实现新闻类app详情页是怎样一种体验?

本文作者分享了在实际项目中使用Weex实现新闻类app详情页的体验,包括Weex的优缺点,如渲染速度、数据处理和跨域问题。作者指出,虽然Weex简化了复杂详情页的构建,但在大量数据渲染和跨域问题上存在挑战。此外,文章提到了如何解决iOS端导航栏显示问题,并提供了项目GitHub地址。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

本文同步发表在:http://www.jianshu.com/p/f6bf7636f81b

先上效果图:

录制好了.gif

详情页:

图片排列.gif

写在前面的话(weex在实际项目中给我的感受):

公司项目中我已尝试部分页面使用Weex实现(iOS端),把weex文件放在了公司服务器上,使用url去加载weex渲染成原生页面(之前我想把文件放在七牛上,但是由于七牛有CDN缓存,每次修改一个文件之后都要刷新该文件,当文件多了之后这是一个比较牙疼的事情,所以就还是扔进了公司的服务器中)。本月中旬公司app新版本发版了,过去了十几天了,从体验上来说,weex渲染的页面还是和纯native写的页面在细微的用户体验上来说还是有差别的(weex写的总感觉还是没原生的流畅,当然可能由于在下水平有限,代码没写好的原因)。特别是在某个查询页面中,由于后台数据没有做分页处理,导致请求数据时后台一下子返回了几千条数据(汗,为啥不分页)。在用list和cell去显示的时候发现原生的tableView一直在不断的渲染cell,几千数据要渲染三四分钟,而此时页面中所有的相应事件失效(其实是延迟,等页面渲染完成后如点击事件才响应)。造成了很不好的体验,导致我对数据多的时候使用weex形成了恐惧。可见Weex渲染原生tableView的时候cell的重用机制没有做好。最后没办法,既然后台没做分页,那只能我来做,控制每次只显示20条数据,然后添加上拉加载更多….由此解决了懵逼了好久的tableView渲染问题。 由此终于体会到了宛如H5版的发版节奏(马上修改马上生效,再也不用等发版了)。这感觉怎一个爽字了得。

回到本文的主题:

用Weex实现新闻类详情页面是怎样的一种体验?

爽!
weex用数据去渲染界面和iOS native 先写界面再填充数据的思想还是很不一样的,正如一系列复杂的详情类页面一样,用native不管是oc还是swift写的时候那叫一个蛋疼啊,如果能够根据数据实时的去渲染页面(从一堆数据中遇到图片就显示图片,遇到表格就显示表格,遇到文字就显示文字,那且不是比native获取到数据之后拼接成html的格式然后使用webView去加载省事简单了许多),把数据组装成html在webView中显示是目前大多数详情类页面采用的方案。
可参考这篇文章:https://blog.6ag.cn/1514.html
当然使用Weex貌似就简单许多了。比如下面这种表格页面:
IMG_6285.PNG
IMG_6286.PNG
数据接口如下:
http://api.ycapp.yiche.com/appnews/GetStructNews?newsId=65523&ts=20161215074823&plat=2&theme=0&version=7.6

如果要用native实现的话估计得花一段时间才能解决,那么用weex就很容易实现了:

<div if=
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值