npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

client-analytics-sdk

v1.0.2

Published

shein performence analytics report

Downloads

8

Readme

CLIENT ANALYTICS SDK

ClientAnalytics 性能上报系统SDK

异步引入

将以下代码放入 html 的 head 里面,需要放在稍微靠前点的位置。 您在使用 ClientAnalytics.track() 时,只要保证写在引用的代码的下面就可以,不需要等 window.onload 后再执行

<script>
  ;(function(para) {
    var w = window, p = para.sdk_url, d = document, n = para.name || 'ClientAnalytics', x = null, y = null, s = 'script';
    w['sheinClientAnalytic202110'] = n;
    w[n] = w[n] || function(a) {return function() {(w[n]._q = w[n]._q || []).push([a, arguments])}};
    var ifs = ['init', 'registerPage', 'track'];
    for (var i = 0; i < ifs.length; i++) {
      w[n][ifs[i]] = w[n].call(null, ifs[i]);
    }
    if (!w[n]._t) {
      x = d.createElement(s), y = d.getElementsByTagName(s)[0];
      x.async = 1;
      x.src = p;
      // w[n].para = para;
      y.parentNode.insertBefore(x, y);
    }
  })({
    sdk_url: '下载新版本的 clientAnalytics.min.js',
    name: 'ClientAnalytics', // 你希望使用的包的名字,默认 ClientAnalytics
  });

  ClientAnalytics.init({ reportUrl: 'https://xxxx/report', random: 1 })
  ClientAnalytics.track()
</script>

ES模块引入

从 npm 获取 sdk, npm install client-analytics-sdk

import ClientAnalytics from 'client-analytics-sdk'
ClientAnalytics.init({
  reportUrl: '数据接收地址',
  random: 1
  isSinglePage: true, // 单页面配置
});
//开启采集
ClientAnalytics.track()

API

init

SDK 的初始化方法,传入基本配置信息,**必须**要执行该方法,且reportUrl为必须传字段

  • 入参参数

reportUrl

必须. type: String

上报的地址,必须填入

random

必须. type: Number

抽样采集的比例,值为 0~1 之间的一个数字

sendType

非必须. type: String

采集结果上报的形式,可选值:ajax, image, beacon,默认:ajax

isSinglePage

非必须. type: Boolean

告知SDK当前统计的应用是否是但页面应用程序

log

非必须. type: Boolean

是否将上报的信息打印在控制台,供调试

registerPage

对于所有事件都需要添加的属性,可在初始化 SDK 后,调用 registerPage() 将属性注册为公共属性

// 添加公共属性
ClientAnalytics.registerPage({
  deviceType: 'pc',   // 平台
  siteId: 'us',     // 站点
  language: 'en',   // 语言
  pageName: 'index',   // 页面名称
  brand: 'shein',      // 品牌
})

如果当你需要添加的公共字段是个动态参数,可以通过一个函数来动态返回值,定义的方法将会在上报的时候执行并赋值

// 添加公共属性
ClientAnalytics.registerPage({
  isEmptyList: function() {
    return product.list.length > 0 ? 'non-empty' : 'empty'
  }
})

track

关键方法。开启SDK统计上报的开关方法,如果不执行该方法,则不会进行任何收集操作。