性能优化实例

偶然发现老板在使用公司内部的OA系统时,任务管理界面加载速度非常慢,经常刷新之后过个几秒才能展示完所有数据。作为产品经理,保证用户的体验是非常重要的,在经过与老板的沟通后,决定优化这个地方。

前端页面优化

幸好还有点前端开发的底子,面对性能优化这个问题也没有太犯怵。使用Chrome的Developer Tools可以轻松搞清楚哪些地方需要优化。
1. 减少http请求
减少http请求能够减少多次TCP连接占用的时间、多次DNS解析/缓存查找占用的时间。

  1. 使用缓存
    可以使用CDN缓存或浏览器缓存,将css、js、img等静态文件,可以参考浏览器与cdn缓存

  2. 压缩html、css、js
    现在的前端开发环境,一般都会设置生成build包时,合并压缩js、css文件,所以影响较小。

  3. 按需加载
    通过使用Developer Tools发现,现在的OA系统确实存在同时加载内容过多导致加载时间过长的问题,下一步会放懒加载或者将过多的内容用多个tab去呈现的方式优化

  4. 代码优化
    代码优化相对麻烦些,像那些导致页面重绘重排的代码,比如盒模型样式改变等,这些基本都是不可避免的,只能在满足需求的情况向尽量减少类似定位属性浮动属性等的使用

后端性能优化

  1. 网页开启gzip
    网页开启gzip压缩后,能够大大减少数据的大小,从而显著提高网站访问速度。网站是否开启gzip可以通过一个在线小工具查看网页GZIP压缩检测,也可以通过Chrome浏览器的Developer Tools查看。
    开启gzip
    在Response Headers中,如果有Contnet-Encoding:gzip,则说明后端开启了gzip

  2. 接口延迟时间优化异步打印日志
    waiting_1
    waiting_2
    上面两张图可以看到接口的延迟比较长,除了读写db外,可能也有额外的同步io,比如大量日志打印的情况。
    因为我们的OA系统有数据记录的需求,所以需要看一下是不是日志使用同步的方式打印的,如果是的话改成异步打印。

  3. db优化
    大数据量查询db时,需要考虑orm框架本身的缓存机制,一级sql语句的写法是否合理。

总结

以上就是关于公司内部OA系统性能优化方面的小总结

To C产品的会员等级积分体系(二)

电商平台会员及积分体系概况

电商平台特别依赖用户粘性,当用户从A平台购买某件商品后,一般不会再从不同平台购买相同商品,所以如何让用户在有购买需求的第一时间想起某个平台就显得至关重要。下面就调研分析一下电商平台的产品是如何设计其积分体系的:

分类

电商平台会员等级积分体系一般可以分为以下2种:
1. 成长值与积分并用的产品,如:京东(京享值 + 京豆)、淘宝(淘气值 + 天猫积分);
2. 只有成长值的产品,如:小红书。

电商平台的会员体系可以分为以下3种:
1. 只有付费会员,如:亚马逊;
2. 只有普通会员,如:国美、美丽说;
3. 普通会员与付费会员并存,如:京东、苏宁;
4. 普通会员与定向邀约会员并存,如:淘宝;

下面就整理一下各大电商平台的会员等级积分体系,暂不包括等级阈值的设定原因。


一、淘宝&天猫

天猫源自淘宝商城,会员体系使用淘宝的数据,额外增加了天猫积分。这里就将淘宝与天猫合并一起分析。

继续阅读To C产品的会员等级积分体系(二)

To C产品的会员等级积分体系(一)

大部分To C的产品为了增强用户粘性,都会有自己会员积分体系,所以在设计一款To C的App之前,必须要了解自己的产品适合使用什么样的用户等级积分体系。

用户等级积分关系

先放上一张图,下图是我总结的用户等级与积分关系图

用户等级积分体系

先解释一下这张图:
用户的行为决定了用户获得的成长值,成长值决定了用户所在的等级,不同的等级又决定了用户能够享有什么样的权益;
用户的行为决定了用户获得的积分,用户的积分决定了用户能够获得什么样的回报;
用户等级积分体系以层级分明的固化权益反过来驱动用户通过特定行为积累成长值提高等级,以积分来作为其它回报的兑换条件,驱动用户通过特定行为获取。

用户等级积分体系中的关键元素

如上图所示,整个用户等级积分体系中都避不开行为、成长值、等级、权益、积分、回报这六个元素:
– 行为:用户使用产品的行为,在这里特指能够获取成长值或积分的行为,如:完善资料、分享、签到、在线时长等;
– 成长值:用户等级体系中衡量等级的标准,如:淘宝的淘气值、京东的京享值等;
– 等级:用户在该产品中的会员等级,这里指的不是网络游戏中的角色等级,而是指该账号的会员等级。如:苏宁的新人、V1、V2、V3、V4等级,QQ的VIP等级;
– 权益:用户能够享受的奖励,能否享有权益严格按照用户的等级去衡量,即不同等级享有不同的权益。通常等级越高享有的权益越优;
– 积分:用户积累的用于兑换奖励的东西;
– 回报:积分兑换的奖励,与权益不同,积分对所有用户都是一样的,不会出现有等级限制的问题。如:信用卡的积分换购等。

行为与成长值/积分的关系

在这里,可以将行为粗略的分为两种:会对成长值/积分造成影响的行为和其它行为。这里拿淘宝&天猫举个栗子:
淘宝的淘气值(成长值)用来确定用户等级,是基于用户近12个月的行为计算出来的,包含购物行为、互动行为、基础信誉等。也就是说如果用户想让自己的淘气值变高,需要用户多进行购物、写评价、分享等行为;
淘宝的天猫积分是用以兑换积分权益,最终影响用户所受到的回报,跟等级没有关系。

成长值与等级的关系

等级升降的界定通常非常明确,成长值总额决定会员级别。为了能够保持用户活跃度,成长值通常还会有过期扣除或者按一定周期重新计算的处理。这里拿顺丰举个栗子:
顺丰达到金牌会员所需的成长值要 ≥ 1000,如果 200 < 成长值 < 1000,会员等级为银牌会员。而成长值的多少需要按照一个自然年内会员的实际消费金额决定的,如果没有达到所在等级的成长值要求,还会根据该自然年的实际获得成长值的多少重新划定等级。
至于成长值的门槛,则需要通过分析产品的用户群体,找到留存节点后,再进行计算得出。

等级与权益的关系

不同的等级所对应的权益也不同,一般会根据用户生命周期的类型分别给到不同的权益。
低等级用户通常作为平台的新用户,这时给到的权益一般是通过某些如满减券这样比较粗暴的方式给到;中等级用户作为平台的健康用户/待留存用户,获得的权益通常会比较丰富如极速退款、生日权益等;高等级用户作为平台的粘性用户,获得的权益通常较稀缺且能够彰显身份,如客服专线等。除此之外还有僵尸用户,这类用户在长期不使用产品后一般会享有一定的权益来刺激用户重新使用该产品。

积分与回报的关系

积分与回报通常会存在一定的兑换比例,这点在传统行业中比较明显,如航空公司的历程可以兑换机票,住酒店的积分可以兑换免费住宿等。积分与回报的设定一般还会按照不同的业务类型、不同的毛利去进行不同的设定。
积分按照能否在支付过程中使用分为金本位的硬通货积分和权益积分:
金本位硬通货积分如京豆、天猫积分,这类积分可以在支付过程中当做现金去使用,通常存在一定的兑换比例。平台类产品可以使用此类型的积分;
权益积分通常可以兑换成本不高的消费券类商品,在给用户提供回报的同时,也给其它产品做了引流的操作。

产品分类

接下来的几篇文章会按照产品的功能及本人对产品的使用习惯将要调研的产品分为几大类去调研分析:
1. 电商购物类:淘宝&天猫、京东、小红书、苏宁易购;
2. 网络视频类:爱奇艺、腾讯视频、优酷视频;
3. 短视频微视频类:抖音短视频、火山小视频、快手;
4. 网络社交类:微信、QQ、微博;
5. 生活服务类:支付宝、大众点评、汽车之家;
6. 出行类:百度地图、滴滴出行、去哪儿;

项目投资相关工具

最近公司有开发投资辅助工具的需求,再更投资部门的同事沟通需求后发现,项目投资的流程基本可以抽象为三步:1.投资经理搜集数据;2.投资经理产出报告(预审报告、立项报告等);3.上级主管决策。
投资经理们为了产生一篇篇的报告,需要使用文字/语言记录及数据搜寻的相关工具。下面整理一下跟同事们沟通及网上搜集到的工具。

金融数据终端

这个是最常用也是功能最强大的工具,可以查到股票、债券、基金、衍生品、指数、宏观行业等各类金融市场数据,通常需要付费并且安装到电脑上使用。常用的有:
1. Wind咨询金融终端
2. 慧博智能策略终端
3. Choice金融终端

企业数据

企业数据一般用于查询企业基本信息、历史沿革、实际控制人及其企业等信息。常用的有:
1. 天眼查
2. 企查查

市场

  1. 融资融券明细;
  2. 中登股票账户统计;
  3. 最新基金重仓股排行榜;
  4. 公募基金收益率排名;
  5. 新浪条件选股;
  6. 港股数据;
  7. 港股上市公司融资额查询;
  8. 美股明星股数据;

App数据、口碑等

查询互联网相关企业时,可以使用百度指数、App下载量等工具进行竞品数据的对比。
1. 百度指数;
2. 艾瑞App指数;
3. 艾瑞PC指数;
4. 应用雷达ios总榜;

法律法规

  1. 春晖投行在线

细分行业

新能源汽车

  1. 高工锂电;
  2. 动力电池网;
  3. 中国电动汽车网;

linux部署Jupyter notebook

一、安装python环境

1.下载python3

wget https://www.python.org/ftp/python/3.6.0/Python-3.6.0.tgz

2.解压文件

tar -xvf Python-3.6.0.tgz

3.创建安装文件的路径

mkdir /usr/local/python3

4.编译

./configure --prefix=/usr/local/python3

5.安装

make
make install

二、安装配置Jupyter

1.安装Jupyter notebook

pip install jupyter notebook

继续阅读linux部署Jupyter notebook

基于Vuejs、vue-router、iview的管理后台

上一篇分享的是使用angularjs及materialdesign的管理后台前端页面的实现。因为感觉input的输入框实在是太丑了,并且用户端的页面我早已开发完毕,就等着后端给接口了,所以就萌生出了使用心中一直念念不忘的Vuejs来实现一版管理后台。

这个使用了Vue-cli来构建vue架构,使用vue-router来搭建路由,使用iview来作为UI框架。

项目构建

  1. 安装nodejs
    nodejs安装及常用快捷键
    建议安装nvm来控制nodejs的版本,上面的链接里有详细的步骤,包括启动node服务常用的PM2等等…
  2. 全局安装webpack、vue-cli脚手架
    npm install -g webpack vue-cli;

  3. 创建工程
    vue init webpack-simple <project name>
    这里直接一路回车就可以了。
    注意:工程名不能是中文

  4. 安装项目依赖
    进入工程,输入npm install就可以了。

  5. 安装路由模块vue-router、网络请求模块vue-resource模块
    npm install --save vue-router vue-resource
    这个会安装到package.jsondependencies中。

  6. 安装UI框架 iView
    npm install --save iview

  7. 使用iView、vue-router、vue-resource

# main.js
import Vue from 'vue';
import VueRouter from 'vue-router';
import VueResource from 'vue-resource';
import iview from 'iview';
import 'iview/dist/styles/iview.css';
import App from './App.vue';

Vue.config.debug = true;
Vue.use(VueRouter);
Vue.use(VueResource);
Vue.use(iview);
  1. 修改webpack.config.js配置文件
    因为使用iView需要引用其css,但是最初的webpack.config.js文件里面并没有配置读取css文件和字体文件或者有的设定的有问题,所以这里需要我们自行修改一下:
{
    test: /\.js$/,
    loader: 'babel-loader',
    exclude: /node_modules/
 },
 {
    test: /\.css$/,
    loader: "style-loader!css-loader"
 },
 {
    test: /\.(eot|woff|woff2|ttf)([\\?]?.*)$/,
    loader: "file-loader"
 },
 {
    test: /\.(png|jpg|gif|svg)$/,
    loader: 'file-loader',
    options: {
      name: '[name].[ext]?[hash]'
    }
 }

继续阅读基于Vuejs、vue-router、iview的管理后台