fontaine
moment
fontaine | moment | |
---|---|---|
5 | 100 | |
1,344 | 47,864 | |
- | 0.1% | |
10.0 | 6.8 | |
7 months ago | 14 days ago | |
TypeScript | JavaScript | |
MIT License | MIT License |
Stars - the number of stars that a project has on GitHub. Growth - month over month growth in stars.
Activity is a relative number indicating how actively a project is being developed. Recent commits have higher weight than older ones.
For example, an activity of 9.0 indicates that a project is amongst the top 10% of the most actively developed projects that we are tracking.
fontaine
- Watch Out for Layout Shifts with ‘ch’ Units
-
Astro Font Fallbacks with Capsize: reduce CLS
An alternative to Capsize for reducing font swap layout shift is Fontaine. It has a Vite plugin, and is able automatically to update font face CSS (like we will do, using Capsize metrics). We do something a little more manual here with Capsize, just to help get a grounding in the issue and solution approach.
-
You don't need zero JS website for a perfect Lighthouse score
Fonts are one of the biggest pain points in the context of performance optimization. I have decided to not use any CDN like Google Fonts but instead, I'm serving them myself. Also, I have used a cool package called Fontaine which reduces CLS by using local font fallbacks with crafted font metrics.
-
How I ruined my SEO
I started using fontaine on my blog. If you haven't tried it out, you can find it here. It helps reduce Cumulative Layout Shift. The flash of unstyled content jank that you can see when you first land on a site, before fonts have loaded. I can't see why that would be an issue. It should improve my blogs Core Web Vitals and help stuff rank better, not worse. I think this is a red herring.
-
Docusaurus: Using fontaine to reduce custom font cumulative layout shift
Custom font usage can introduce cumulative layout shift (or "jank") to your website. This post shows how to use fontaine to reduce this with Docusaurus sites.
moment
-
Top 20 Javascript Libraries on Github
Repository: Moment.js
-
You're parsing URLs wrong.
The fact that moment.js or day.js needs to exist in 2024 bothers me a lot.
-
JavaScript Compare Dates: From Chaos to Clarity
Moment.js lets you do amazing things with dates and times in JavaScript. You can easily compare, change, and format them in different ways. For example, you can say things like "today is Monday" or "3 hours ago" or "12/31/2020". To start with Moment.js, you need to install it and import it into your JavaScript project. For example:
-
How to Convert String to Date in JavaScript
To learn more about Moment.js, please visit their official website.
-
8 NPM Packages for JavaScript Beginners [2024][+tutorials]
Ah, Moment.js, the guardian angel of date and time manipulation. Ever needed to format a date, calculate durations, or display something like "2 days ago"? Moment.js has got your back. It's a lifesaver for anything date and time-related, making it a must-have in your project, especially if you're into making your users feel like you really get them.
-
Adding "Created At" and "Last Updated" Dates to Jekyll
After hours of trying to figure out why Jekyll was still showing "Today" for a post I modified last week, I remembered that I am using the timeago filter from jekyll-timeago plugin. I was rendering the dates using {{ doc.last_modified_at | timeago }}. As you know, Jekyll is a static site generator, and it renders this as HTML at the time of build, and only then. This means any date rendered with timeago is hardcoded as is in the HTML and won't change until the next build. I switched all the dates to the "%-d %b %y" format for now. Might use moment.js in the future to get the timeago dates back.
-
The 20 most used React libraries
moment: Handles date and time manipulations with ease. Learn more
-
👨🚀 Traversing Time with Intl.RelativeTimeFormat()
For the longest time working with dates in JavaScript was a huge pain. That’s why libraries such as moment.js or date-fns are so popular. A lot of times I’d reach for these libraries when working with relative time formatting, but since late last year we’ve had pretty great browser support for the RelativeTimeFormat() method. In my mind, relative dates are just more visually appealing, especially for working with dates internationally. Dates like "5 days ago" or "in 2 months" are far more intuitive for users than 12/12/2023, or 03/11/2027. Folks in the US will see that as March 11, 2027, whereas the rest of the world will see that as November 03, 2027. What a nightmare.
-
Best date library to handle timezones in React Native?
İ am using moment js for a long time. You can check it also. https://momentjs.com/
-
JS Date: The Timezone Tantrum
We could control the DST flip by setting the test's input time to the appropriate time of year (summer/winter). However we couldn't control the timezone. We had to adjust the expected data in the test 🤢 using the same library which the production code used (momentjs).
What are some alternatives?
astro - The web framework for content-driven websites. ⭐️ Star to support our work!
dayjs - ⏰ Day.js 2kB immutable date-time library alternative to Moment.js with the same modern API
date-fns - ⏳ Modern JavaScript date utility library ⌛️
fontaine - Automatic font fallback based on font metrics [Moved to: https://github.com/danielroe/fontaine]
Luxon - ⏱ A library for working with dates and times in JS
Docusaurus - Easy to maintain open source documentation websites.
dateformat - A node.js package for Steven Levithan's excellent dateFormat() function.
blog.johnnyreilly.com - This is the source code for https://johnnyreilly.com
moment-timezone - Timezone support for moment.js
capsize - Flipping how we define typography in CSS.
timeago.js - :clock8: :hourglass: timeago.js is a tiny(2.0 kb) library used to format date with `*** time ago` statement.