活动倒计时的一些想法

经常会遇到秒杀或者活动倒计时的需求，这个应该是工作过程中经常能遇到的。

不可避免的，会产生一些深入思考的行为。这篇笔记就记一下吧。

场景：

后台返回本次活动参与活动的产品的所有倒计时信息以及当前服务器的时间

格式如下:

const arr = [{id: 0,end: Date.parse(new Date("2017-12-01 01:01:10")),now: Date.parse(new Date("2017-12-01 01:01:05")),},{id: 1,end: Date.parse(new Date("2017-12-01 01:01:10")),now: Date.parse(new Date("2017-12-01 01:01:04")),},{id: 2,end: Date.parse(new Date("2017-12-01 01:01:10")),now: Date.parse(new Date("2017-12-01 01:01:03")),},
];

项目列表、项目详情、购物车都会用到它，

以下说明，这里针对的是spa技术栈。

一、最初时候我的想法是，能否开一个全局倒计时，给这些所有产品，然后在需要用到的地方就读取就好了

1.这可以避免开多个倒计时

2.多个页面可以通用

3.其中一个到0的时候去更新其中一个数据

二、大部分情况，这个方案我觉得也可用，但是有一些地方我不是特别满意，觉得可以改进下。

1.全局定时器，不想要全局！

2.如果列表太多，会导致定时器明显变慢

3.不希望不同产品之间的定时器逻辑互相受影响

4.并不是所有产品都

活动倒计时的一些想法相关推荐

iOS活动倒计时的两种实现方式
代码地址如下: http://www.demodashi.com/demo/11076.html 在做些活动界面或者限时验证码时, 经常会使用一些倒计时突出展现. 现提供两种方案: 一.使用NSTim ...
活动倒计时HTML,活动倒计时代码（精确到毫秒）jquery插件
活动倒计时代码(精确到毫秒)jquery插件 - 懒人建站 http://www.51xuediannao.com/ $.extend($.fn,{ //懒人建站 http://www.51xuedi ...
基于Vue.js活动倒计时组件
vue2-countdown vue活动倒计时组件及遇到的坑基于vue2.x的活动倒计时组件主要是最近为了公司做一个倒计时活动才找到了这个组件使用的.于是去github上翻看了文档结果是一年多没更 ...
redis的活动倒计时秒杀问题
版权声明:本文为博主原创文章,转载需标明出处哦 ^-^. https://blog.csdn.net/qq_33101675/article/details/83118461 我们知道电商里有很多场景 ...
php活动倒计时代码,JavaScript实现活动倒计时效果的代码分享
这篇文章主要为大家详细介绍了基于JavaScript实现活动倒计时效果,距离活动时间还剩多少,具有一定的参考价值,感兴趣的小伙伴们可以参考一下本文实例为大家分享了js倒计时效果的具体代码,供大家参考 ...
原生JS活动倒计时实现思路
原生JS活动倒计时实现思路由于一个活动页面里面有多个活动,所以用map去操作每一个对象,只有一个活动的话就不需要遍历了,活动分为距离活动开始和距离活动结束两个倒计时,自己可按需求增减代码.还有就是I ...
Vue活动倒计时的功能
Vue的活动倒计时功能话不多说,直接上代码吧,我是前端小白一枚,我搬过的砖给大家共享啦~ 欢迎大佬批评指教~ 第一步: 创建组件: <template><div class ...
bwiki样式的活动倒计时html代码（带渐变色进度条）
首先我发现b站wiki它这个样式很好看,于是就仿照着,并根据一些其他代码模仿了一个,很适合其他需要做活动倒计时的小网站,只需要html代码就能实现. 废话不多说,直接上代码. <div id=& ...
怎么在php网站大图加倒计时,WordPress站点添加活动倒计时功能教程
限时的活动或是报名中,作为促进消费和转化用户是非常好用的一个营销功能,可以让访客抓紧时间想要获取内容或是福利,添加活动就需要活动倒计时功能,今天为大家分享一下WordPress站点添加活动倒计时功能教 ...

活动倒计时的一些想法

活动倒计时的一些想法相关推荐

最新文章

热门文章