Comments (7)
jehna
commented on September 25, 2024
1
So I would just put that somewhere else early on the page, I don't need to modify what's already there in the script, correct?
Yes, very good point. I think you should always put the <link> tags inside your <head> tag
I thought preconnect needed to be part of the loading code which is why I was confused.
Yes, I can see your point of view. Thank you for bringing this up! I'll make sure to add a note about this to the readme a bit later. I'll leave this issue open to remind myself until I do
from ga-lite.
jehna
commented on September 25, 2024
Hey, could you give me an example how you would do this with Google Analytics or link to the page where Google suggests using the prefetch?
I'm guessing this should do it:
<link rel="prefetch" href="https://cdn.jsdelivr.net/npm/ga-lite@2/dist/ga-lite.min.js" as="script">from ga-lite.
datapolitical
commented on September 25, 2024
Here’s the example: https://web.dev/uses-rel-preconnect/
and the current code says to load it like this:
<script>
(function(e,t,n,i,s,a,c){e[n]=e[n]||function(){(e[n].q=e[n].q||[]).push(arguments)}
;a=t.createElement(i);c=t.getElementsByTagName(i)[0];a.async=true;a.src=s
;c.parentNode.insertBefore(a,c)
})(window,document,"galite","script","{{site.url}}/assets/js/ga-lite.min.js");
galite('create', '{{site.google_analytics}}', 'auto');
galite('send', 'pageview');
</script>
I don’t see how that integrates with the recommended script.
from ga-lite.
jehna
commented on September 25, 2024
Great, thank you for the additional information!
You're using {{site.url}}/assets/js/ga-lite.min.js, so it seems you're self-hosting ga-lite. That's great!
This page seems to suggest that you use the <link rel="preconnect" href="https://example.com"> to open up connections to domains other than your own to speed up the DNS resolving, making https connection etc.
In your case it seems that you're serving ga-lite from your own domain, so AFAIK this would have very little effect.
However the page says that:
In general, try to use
<link rel="preload">, as it's a more comprehensive performance tweak, but do keep<link rel="preconnect">in your toolbelt for the edge cases like:
- Use-case: Knowing Where From, but not What You're Fetching
- Use-case: Streaming Media
In this case we don't have streaming media, and we know what we're fetching, so <link rel="preload"> seems like a better approach.
I think in your case the best solution would be to use:
<link rel="preload" href="{{site.url}}/assets/js/ga-lite.min.js" as="script">from ga-lite.
datapolitical
commented on September 25, 2024
So I would just put that somewhere else early on the page, I don't need to modify what's already there in the script, correct?
I thought preconnect needed to be part of the loading code which is why I was confused.
And I should say, thank you for the extensive and prompt replies.
from ga-lite.
datapolitical
commented on September 25, 2024
Here's another lighthouse issue I just came across

from ga-lite.
jehna
commented on September 25, 2024
Thank you for reporting! I opened a separate issue for that at #253
from ga-lite.
Related Issues (20)
- Support for the new Google Analytics 4 tag HOT 9
- Use keepalive flag with fetch
- Capture ga() function calls and re-route them through galite() HOT 5
- ESM version for modern browsers HOT 10
- Universal Analytics (GA3) and GA4 same time HOT 2
- Illegal Invocation error due to lack of navigator.sendBeacon binding HOT 1
- Self Referral Traffic
- NPM bundle not including commands directory HOT 1
- Customizable endpoint URL and User Language HOT 2
- Instructions on using esm version to readme HOT 4
- SyntaxError Unexpected token = HOT 2
- Yarn run build not working HOT 4
- XMLHttpRequest on main thread is deprecated HOT 2
- Are Conversion Tags Possible & Phone Number Tags HOT 4
- Disableing of ga-lite through cookie HOT 4
- SSR issue introduced HOT 5
- It should be mentioned that ga-lite doesn't use cookies HOT 3
- Stop working on Chrome 85+ for somehow HOT 6
- Test coverage for SSR / node.js compatibility HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from ga-lite.