songEagle

STAY CURIOUS. STAY HUMBLE.

发布于 07月29, 2019

经验分享

【解决方案】数据埋点的一点思路与vue的SPA单页面实践

经验分享 2019年07月29日 星期一 上午

一、前言

数据埋点是监控用户在应用中的表现行为,对于TO C的产品迭代来说越来越重要。

数据埋点是产品需求分析的来源,检验功能是否达到预期。前端是更贴近用户,我来说说数据埋点在系统开发中的方案。

二、数据埋点方案分析

不同的产品对于数据的关注的角度不同,根据需求来采集和设计不同的方案。比如信息流的产品抖音,关注用户的停留时间更高。比如商品类的注重的是“复购率”,统计新老用户。

MORE

发布于 07月25, 2019

经验分享

【nginx系列】nginx升级到支持http_image_filter_module处理图片

经验分享 2019年07月25日 星期四 上午

一、前言

最近在研究nginx在前端中使用最大化,发现了可以很好的处理图片。

二、http_image_filter_module模块

我们先来到软件包的地方看到了configure。

image

MORE

发布于 07月23, 2019

经验分享

【nginx系列】nginx升级到支持HTTP2.0

经验分享 2019年07月23日 星期二 下午

一、前言

最近想折腾一下服务器,升级到http2.0。

然后nginx照着官网配置了一下 ```

    # ssl写在443端口后面。这样http和https的链接都可以用
    listen 443 ssl http2 default_server;
    server_name chat.chengxinsong.cn;

# HSTS的合理使用,max-age表明HSTS在浏览器中的缓存时间,includeSubdomainscam参数指定应该在所有子域上启用HSTS,preload参数表示预加载,通过Strict-Transport-Security: max-age=0将缓存设置为0可以撤销HSTS

MORE

发布于 07月23, 2019

经验分享

【npm系列】如何升级自己之前写的npm包,然后发布到npm官网上,然后其他项目怎么更新最新的包

经验分享 2019年07月23日 星期二 下午

一、前言

之前写了一篇发布npm包,手把手教你用npm发布第一个npm包的详细教程:https://www.mwcxs.top/page/600.html 如果你想升级自己写的包,该如何做,本文就是介绍这个的。

二、准备阶段

1、你经写了一个npm包(watermark-dom),然后已经上传到npm中,那么它的版本就是1.0.0;

image

MORE

发布于 07月23, 2019

经验分享

【JavaScript系列】动态绑定事件方法:(1)jquery的on方法;(2)html元素绑定

经验分享 2019年07月23日 星期二 下午

一、动态监听加载对象

    当使用js或jQuery动态创建元素(例如append,appendChildren),再用on(事件, function(){...})或addEventListener监听事件时,事件并不会触发,因为传统的$('.selector').click()只能监听html初始的对象,对于动态加载的操作,需要在加载后给他的操作行为绑定方法。 

  所以,我们可以使用jQuery的on()事件来获取未加载页面的内容,并为它添加一个或多个事件处理程序。

二、jQuery.on()用法

MORE

发布于 07月19, 2019

经验分享

【模块化系列】Nodejs模块化的原理

经验分享 2019年07月19日 星期五 上午

一、前言

node的应用是模块组成的,Node遵循commonjs的模块规范,用来隔离每个模块的作用域,使每一个模块在自身的命名空间中执行。

commonjs的主要内容:

模块必须通过module.exports导出对外的变量或接口,通过require()来导入其他模块的输出到当前模块作用域中。

commonjs模块特点:

MORE

发布于 07月19, 2019

经验分享

【elementUI系列】机智使用elementUI调用一次接口同时上传图片和文件,同时需要携带其他参数,实现调用后端接口

经验分享 2019年07月19日 星期五 上午

今天有一个坑,同时要上传图片和文件,而且图片要展示缩略图,文件要展示列表。

我的思路是:

首先,只上传附件照片,这个直接看ele的官方例子就行,不仅仅上传附件照片,还同时上传其他参数。

然后,再做上传照片和文件,上传其他参数,其实也就是文件合并。

MORE

发布于 07月05, 2019

经验分享

【elementUI系列】elementUI中表格的【筛选功能】和【排序功能】同时使用:表格表头筛选,表格表头排序,后端排序,后端筛选

经验分享 2019年07月05日 星期五 下午

一、前言

最近在写项目的时候,发现自己对elementUI的表格,自己想吐槽一下table的组件,可能是没有理解透文档中的说明使用。

二、需求

要做成这样的:

image

MORE

发布于 07月05, 2019

经验分享

vue项目中实现滚动条(具体视窗口的滚动条)操作:(1)置底,(2)置于上次停留的位置

经验分享 2019年07月05日 星期五 上午

一、前言

之前写了一个happyChat的项目,主要是想学习一下socketIO的使用。然后最近在给happyChat做前端优化和升级。发现第一版做的很low。

需要优化的问题: ``` 1、问题1:滚动条会出现在头部和底部的视窗中,之前固定头部和固定底部是使用position:fixed

解决方案:body和html禁止overflow:hidden,头部和底部是position:relative,聊天视窗使用overflow: auto,这样聊天视窗才会出现滚动条。滚动条不会出现在头部和底部视窗中。

2、问题2:聊天视窗一次性加载了所有的聊天内容,如果数据太多会出现超时的问题。

MORE

发布于 06月28, 2019

经验分享

【css系列】六种实现元素水平居中方法

经验分享 2019年06月28日 星期五 晚上

一、前言

居中效果在CSS中很是普通的效果,平时大家所看到的居中效果主要分为三大类:水平居中、垂直居中和水平垂直居中。而其中水平居中相对于后两者来说要简单得多。使用了css3的flexbox的属性轻松实现多行文本水平垂直居中的方法。当然大家有可能认为这些方法对于浏览嘎嘎的兼容性处理太麻烦了。

二、六种方法

常见的居中是固定宽度,加上margin: 0 auto。但是如果宽度不明确,我们也要尝试一下。

MORE

加载更多

本站总访问量 本站访客数人次