Skip to content

Commit 503d3af

Browse files
cotes2020cotes2020
committed
Improved the PV fetching experience.
1 parent 8dd4888 commit 503d3af

9 files changed

Lines changed: 156 additions & 39 deletions

File tree

‎_config.yml‎

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -55,12 +55,14 @@ google_analytics:
5555
# Fill with your Google Analytics ID
5656
id: ''
5757
# The Google Analytics pageviews switch.
58-
# DO NOT enable it unless you know how to deploy the Google Analytics superProxy.
59-
pv: false
60-
# superProxy baseURL and URL, only valid when `google_analytics.pv` is set to 'true'
61-
proxy_baseurl: ''
62-
proxy_url: ''
6358

59+
pv:
60+
# DO NOT enable it unless you know how to deploy the Google Analytics superProxy.
61+
enabled: false
62+
# the next options only valid when `google_analytics.pv` is enabled.
63+
proxy_url: ''
64+
proxy_endpoint: ''
65+
cache: false # pv data local cache, good for the users from GFW area.
6466

6567
disqus:
6668
comments: false # boolean type, the global switch for posts comments.

‎_includes/head.html‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -34,9 +34,9 @@
3434
<link rel="preconnect" href="https://www.googletagmanager.com" crossorigin="anonymous">
3535
<link rel="dns-prefetch" href="https://www.googletagmanager.com">
3636

37-
{% if site.google_analytics.proxy_baseurl and site.google_analytics.pv %}
38-
<link rel="preconnect" href="{{ site.google_analytics.proxy_baseurl }}" crossorigin="use-credentials">
39-
<link rel="dns-prefetch" href="{{ site.google_analytics.proxy_baseurl }}">
37+
{% if site.google_analytics.pv.proxy_url and site.google_analytics.pv.enabled %}
38+
<link rel="preconnect" href="{{ site.google_analytics.pv.proxy_url }}" crossorigin="use-credentials">
39+
<link rel="dns-prefetch" href="{{ site.google_analytics.pv.proxy_url }}">
4040
{% endif %}
4141
{% endif %}
4242

@@ -122,7 +122,8 @@
122122

123123
{% if page.layout == 'home' or page.layout == 'post' %}
124124
<script src="{{ site.baseurl }}/assets/js/dist/timeago.min.js" async></script>
125-
{% if site.google_analytics.pv %}
125+
{% if site.google_analytics.pv.enabled %}
126+
<script src="{{ site.baseurl }}/assets/data/pv-data.json"></script>
126127
<script src="{{ site.baseurl }}/assets/lib/countUp.min.js" async></script>
127128
<script src="{{ site.baseurl }}/assets/js/dist/pageviews.min.js" async></script>
128129
{% endif %}

‎_layouts/home.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ <h1>
2828
<i class="unloaded">{{ post.date | date_to_xmlschema }}</i>
2929
</span>
3030
<!-- page views -->
31-
{% if site.google_analytics.pv %}
31+
{% if site.google_analytics.pv.enabled %}
3232
<i class="far fa-eye fa-fw"></i>
3333
<span id="pv_{{-post.title-}}" class="pageviews">
3434
<i class="fas fa-spinner fa-spin fa-fw"></i>

‎_layouts/post.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,7 @@ <h1 data-toc-skip>{{ page.title }}</h1>
3131
</div>
3232

3333
<!-- page views -->
34-
{% if site.google_analytics.pv %}
34+
{% if site.google_analytics.pv.enabled %}
3535
<div>
3636
<span id="pv" class="pageviews"><i class="fas fa-spinner fa-spin fa-fw"></i></span> views
3737
</div>

‎assets/data/proxy.json‎

Lines changed: 0 additions & 6 deletions
This file was deleted.

‎assets/data/pv-data.json‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
---
2+
layout: compress
3+
---
4+
5+
const proxyData = '{"url": "{{ site.google_analytics.pv.proxy_endpoint }}"}';
6+
7+
{%- capture pv_data -%}
8+
{%- if site.google_analytics.pv.cache and site.google_analytics.pv.enabled -%}
9+
{% include_relative pageviews.json %}
10+
{%- endif -%}
11+
{%- endcapture -%}
12+
13+
const pageviews = '{{ pv_data }}';

‎assets/data/search.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
---
2+
layout: compress
23
---
34

45
[

‎assets/js/_src/pageviews.js‎

Lines changed: 127 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
*
44
* Dependences:
55
* - jQuery
6-
* - countUp.js(https://github.com/inorganik/countUp.js)
6+
* - countUp.js <https://github.com/inorganik/countUp.js>
77
*
88
* v2.0
99
* https://github.com/cotes2020/jekyll-theme-chirpy
@@ -77,42 +77,148 @@ function displayPageviews(data) {
7777
var path = window.location.pathname;
7878
tacklePV(rows, path, $('#pv'), hasInit);
7979
}
80-
8180
}
8281

8382

8483
var getInitStatus = (function() {
8584
var hasInit = false;
8685
return function() {
87-
if (hasInit) {
88-
return true;
89-
} else {
86+
let ret = hasInit;
87+
if (!hasInit) {
9088
hasInit = true;
91-
return false;
9289
}
90+
return ret;
9391
}
9492
})();
9593

9694

95+
var PvCache = (function() {
96+
const KEY_PV = "pv";
97+
const KEY_CREATION = "pv-created-date";
98+
const KEY_PV_TYPE = "pv-type";
99+
100+
var PvType = {
101+
ORIGIN: "origin",
102+
PROXY: "proxy"
103+
};
104+
105+
function get(key) {
106+
return localStorage.getItem(key);
107+
}
108+
109+
function set(key, val) {
110+
localStorage.setItem(key, val);
111+
}
112+
113+
return {
114+
getData: function() {
115+
return JSON.parse(localStorage.getItem(KEY_PV) );
116+
},
117+
saveOriginCache: function(pv) {
118+
set(KEY_PV, pv);
119+
set(KEY_PV_TYPE, PvType.ORIGIN );
120+
set(KEY_CREATION, new Date().toJSON() );
121+
},
122+
saveProxyCache: function(pv) {
123+
set(KEY_PV, pv);
124+
set(KEY_PV_TYPE, PvType.PROXY );
125+
set(KEY_CREATION, new Date().toJSON() );
126+
},
127+
isOriginCache: function() {
128+
return get(KEY_PV_TYPE) == PvType.ORIGIN;
129+
},
130+
isProxyCache: function() {
131+
return get(KEY_PV_TYPE) == PvType.PROXY;
132+
},
133+
isExpired: function() {
134+
if (PvCache.isOriginCache() ) {
135+
let date = new Date(get(KEY_CREATION));
136+
date.setDate(date.getDate() + 1); // fetch origin-data every day
137+
return Date.now() >= date.getTime();
138+
139+
} else if (PvCache.isProxyCache() ) {
140+
let date = new Date(get(KEY_CREATION) );
141+
date.setHours(date.getHours() + 1); // proxy-data is updated every hour
142+
return Date.now() >= date.getTime();
143+
}
144+
return false;
145+
},
146+
getAllPagevies: function() {
147+
return PvCache.getData().totalsForAllResults["ga:pageviews"];
148+
},
149+
newerThan: function(pv) {
150+
return PvCache.getAllPagevies() > pv.totalsForAllResults["ga:pageviews"];
151+
}
152+
};
153+
154+
})(); // PvCache
155+
156+
157+
function fetchOriginPageviews(pvData) {
158+
if (pvData === undefined) {
159+
return;
160+
}
161+
displayPageviews(pvData);
162+
PvCache.saveOriginCache(JSON.stringify(pvData));
163+
}
164+
165+
166+
function fetchProxyPageviews() {
167+
let proxy = JSON.parse(proxyData); // see file '/assets/data/pv-data.json'
168+
$.ajax({
169+
type: 'GET',
170+
url: proxy.url,
171+
dataType: 'jsonp',
172+
jsonpCallback: "displayPageviews",
173+
success: function(data, textStatus, jqXHR) {
174+
PvCache.saveProxyCache(JSON.stringify(data));
175+
},
176+
error: function(jqXHR, textStatus, errorThrown) {
177+
console.log("Failed to load pageviews from proxy server: " + errorThrown);
178+
}
179+
});
180+
}
181+
182+
97183
$(function() {
98-
// load pageview if this page has .pageviews
184+
99185
if ($('.pageviews').length > 0) {
100186

101-
// Get data from daily cache.
102-
$.getJSON('/assets/data/pageviews.json', displayPageviews);
103-
104-
$.getJSON('/assets/data/proxy.json', function(meta) {
105-
$.ajax({
106-
type: 'GET',
107-
url: meta.proxyUrl,
108-
dataType: 'jsonp',
109-
jsonpCallback: "displayPageviews",
110-
error: function(jqXHR, textStatus, errorThrown) {
111-
console.log("Failed to load pageviews from proxy server: " + errorThrown);
187+
let originPvData = pageviews ? JSON.parse(pageviews) : undefined;
188+
let cache = PvCache.getData();
189+
190+
if (cache) {
191+
if (PvCache.isExpired()) {
192+
if (PvCache.isProxyCache() ) {
193+
if (originPvData) {
194+
if (PvCache.newerThan(originPvData)) {
195+
displayPageviews(cache);
196+
} else {
197+
fetchOriginPageviews(originPvData);
198+
}
199+
}
200+
201+
fetchProxyPageviews();
202+
203+
} else if (PvCache.isOriginCache() ) {
204+
fetchOriginPageviews(originPvData);
205+
fetchProxyPageviews();
112206
}
113-
});
114207

115-
});
208+
} else { // still valid
209+
displayPageviews(cache);
210+
211+
if (PvCache.isOriginCache() ) {
212+
fetchProxyPageviews();
213+
}
214+
215+
}
216+
217+
} else {
218+
fetchOriginPageviews(originPvData);
219+
fetchProxyPageviews();
220+
}
221+
222+
}
116223

117-
} // endif
118224
});

‎assets/js/dist/pageviews.min.js‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)