epicweb-dev / client-hints Goto Github PK
View Code? Open in Web Editor NEWEliminate a flash of incorrect content by using client hints
Home Page: https://github.com/epicweb-dev/client-hints
Eliminate a flash of incorrect content by using client hints
Home Page: https://github.com/epicweb-dev/client-hints
Related: epicweb-dev/epic-stack#580 (comment)
I had migrated from a simple stack on Vercel to the Epic Stack on Fly (❤️ love it) and had assumed I had some redirect breaking channel attribution in GA and spun out on that for a while.
Last week I was looking thru the client hints code and had an A-ha seeing the window.location.reload();
in there. A page reload sets the page referrer to the current page and since client-hinds runs inline at the top of the document, it runs before any analytics does. In the chart below you can see my direct traffic goes to normal levels after I removed the client hint code.
For my site, assuming many others, understanding attribution as accurately as possible is important for verifying success of paid campaigns, social media, emails etc. We should probably document this trade-off and maybe offer some sort of opt-in or manual handle of reload on cookie diff to preserve referrer?
I saw a warning about this being an issue in Firefox
Hello!
I have a project using epic-stack and I decided to apply the same changes as epicweb-dev/epic-stack@d312d7b and epicweb-dev/epic-stack@ae3f66a to start using @epic-web/client-hints
.
However, upon doing the change, @typescript-eslint
started to complain about unsafe assignments due to hints
being of type any
, even though VSCode is saying getHints
returns ClientHintsValue<Hints>
.
The difference to the pre-@epic-web/client-hints
usage is that getHints
used to return a simple object:
Looking into getHints
, the implementation is the same in both versions, but what changes are the type definitions:
Before
{
[name in ClientHintNames]: (typeof clientHints)[name] extends {
transform: (value: string) => infer ReturnValue;
}
? ReturnValue
: (typeof clientHints)[name]["fallback"];
},
After
Hints extends Record<string, ClientHint<any>>
After a lot of searching, I think this is the same issue as reported by Kent here: sindresorhus/type-fest#667
The referenced workaround is to change from any
to unknown
but I'm not sure if that's enough, as I tried to manually change the .d.ts
file in node_modules
and it didn't work.
npx create-epic-app@latest
requestInfo.hints
in app/utils/request-info.ts
, such as console.log(data.requestInfo.hints)
hints
is recognized as any
in VSCode even though it has the correct type passed into JsonifyObject
Sorry for opening an issue for this, it's not really an issue. I didn't find the discussions tab, so I created this issue to ask if you're open to adding more hints. If you are, then I'd like to contribute one for the user's locale.
That's necessary for full compatibility with ESM in TypeScript when using "moduleResolution": "NodeNext"
.
When the import doesn't have the extension, TypeScript can't properly resolve it:
After I manually add the extension, you can see now it resolves correctly:
TypeScript doesn't modify the paths used in the imports when compiling, so it's really a matter of adding the extension to all imports in the source code.
In some rare instances, we have seen users timezones set to a comma separated string of timezones, which looked like this:
'America/New_York,America/New_York'. I'm wondering if this could be a bug in the library or related to users browsers, or manual intervention potentially?
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.