qwik
web-vitals
Our great sponsors
qwik | web-vitals | |
---|---|---|
132 | 140 | |
20,194 | 7,113 | |
1.4% | 2.2% | |
9.9 | 7.7 | |
1 day ago | 13 days ago | |
TypeScript | JavaScript | |
MIT License | Apache License 2.0 |
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.
qwik
-
Episode 24/13: Native Signals, Details on Angular/Wiz, Alan Agius on the Angular CLI
Similarly to Promises/A+, this effort focuses on aligning the JavaScript ecosystem. If this alignment is successful, then a standard could emerge, based on that experience. Several framework authors are collaborating here on a common model which could back their reactivity core. The current draft is based on design input from the authors/maintainers of Angular, Bubble, Ember, FAST, MobX, Preact, Qwik, RxJS, Solid, Starbeam, Svelte, Vue, Wiz, and more…
- Ask HN: Freelance website builders/maintainers, what's in your 2024 toolkit?
-
I Deployed My Own Cute Lil’ Private Internet (a.k.a. VPC)
Each app’s front end is built with Qwik and uses Tailwind for styling. The server-side is powered by Qwik City (Qwik’s official meta-framework) and runs on Node.js hosted on a shared Linode VPS. The apps also use PM2 for process management and Caddy as a reverse proxy and SSL provisioner. The data is stored in a PostgreSQL database that also runs on a shared Linode VPS. The apps interact with the database using Drizzle, an Object-Relational Mapper (ORM) for JavaScript. The entire infrastructure for both apps is managed with Terraform using the Terraform Linode provider, which was new to me, but made provisioning and destroying infrastructure really fast and easy (once I learned how it all worked).
-
JavaScript Bloat in 2024
If you want to see the framework that does it right, check out Qwik.
Incredibly small JS / CSS bundles. Only loads what it needs.
https://qwik.dev/
- The Qwik has a new domain name
- Qwik v1.4.5
-
How to Ensure Pixel-Perfect Comparisons Between Websites?
So here at Builder.io, my first task was to ensure that we migrated our site from Next.js to Qwik with a 100% pixel match. We aimed to utilize the power of Qwik to enhance our site's performance to unprecedented levels.
-
How (not) to contribute to open source
That was the last straw; cumulatively, I had spent more time looking for something to do than actually doing it. But I really wanted to contribute! So a few more months went by, until one day I met an Italian open source maintainer and long-time speaker, Giorgio Boa, who by the way was a guest on our podcast Continuous Delivery, and asked him for advice, saying that I wanted to be part of the OS world. He said he was working on a small library of Qwik components and could help me if I wanted. I gladly accepted, and we found an issue that seemed pretty straightforward. A few days after our conversation, I followed the little README guide to install everything required, and...nothing worked. So, after a few bad words, a lot of doubt about my skills as an engineer, and self pep talks to overcome my shyness about asking for help, I contacted Giorgio again. Even with his help, at first we had some trouble figuring out what was going wrong, but in the end I finally had a working setup.
-
AI for Web Devs: Faster Responses with HTTP Streaming
In the previous post, we got AI generated jokes into our Qwik application from OpenAI API. It worked, but the user experience suffered because we had to wait until the API completed the entire response before updating the client.
-
AI for Web Devs: Project Introduction & Setup
In this series, we’ll learn how to integrate OpenAI‘s AI services into an application built with Qwik, a JavaScript framework focused on the concept of resumability (this will be relevant to understand later).
web-vitals
-
Top 20 Frontend Interview Questions With Answers
Google Core Vitals now represent the most important metrics to focus on when it comes to technical SEO. Google Core Vitals are a set of standardized metrics that Google uses to evaluate the user experience offered by a web page and assign it a technical SEO grade. Several tools exist to measure and report technical SEO performance, but the most reliable is Google Lighthouse.
- Measure Web Performance with Web Vitals
-
The Sisyphean Quest for Web Performance
-https://www.patterns.dev/ -https://github.com/reactjs/rfcs/blob/main/text/0188-server-components.md -https://dev.to/this-is-learning/qwik-the-post-modern-framework-3c5o -https://dev.to/this-is-learning/astro-framework-169m -https://developers.google.com/web/updates/2019/02/rendering-on-the-web -https://web.dev/vitals/
-
Meet the new Core Web Vital: Interaction to Next Paint (INP) 🎨
Image source: https://web.dev/vitals/
- Optimisation des images pour des performances web : techniques et conseils
-
Interaction to Next Paint (INP)
You will be pleased to know that isn’t actually the case and it’s a suite of metrics instead known collectively as core web vitals https://web.dev/vitals/
-
Is Lighthouse a misleading performance tool?
Let's go back to 2020, this was when Google made a big change regarding their performance rating -- they introduced the Core Web Vitals. I want to discuss this timeframe because it was the last point where there is clear comparable data between the performance metric set (5 metrics) and the Core Web Vitals (3 metrics). The Core Web Vitals is a subset of the performance metric set.
-
What Next.js Has to Offer React Developers
Beyond elevating the user experience, another clear benefit of speeding up the rendering of a website is search engine optimization (SEO). Speed is so important to ranking well on search engines that it’s included in Google’s published description of what their indexers use to rank websites for performance, called Core Web Vitals.
-
Climate-friendly software: don't fight the wrong battle
This is something we won't ever be able to measure, as it depends on how people perceive the overall experience on their device, but it boils down to perceived performance. So by all means, optimize your mobile apps and web frontends, test on old devices and slow networks (even if only emulated), and monitor their real-user performance (e.g. through Web Vitals). As part of performance testing, have a look on electricity use, as it will both be directly associated with emissions to produce that electricity, and be perceptible by the user (battery drain). And don't forget to account for the app downloads as part of the overall perceived performance: light mobile apps that don't need to be updated every other day, frontend JS and CSS that can be cached and won't update several times a day either (defeating the cache).
What are some alternatives?
astro - The web framework for content-driven websites. ⭐️ Star to support our work!
Tailwind CSS - A utility-first CSS framework for rapid UI development.
solid - A declarative, efficient, and flexible JavaScript library for building user interfaces.
Cypress - Fast, easy and reliable testing for anything that runs in a browser.
React - The library for web and native user interfaces.
TypeScript - TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
Svelte - Cybernetically enhanced web apps
jest - Delightful JavaScript Testing.
Next.js - The React Framework
lighthouse-ci - Automate running Lighthouse for every commit, viewing the changes, and preventing regressions
vue-lazy-hydration - Lazy Hydration of Server-Side Rendered Vue.js Components
sveltekit-simple-image-gallery - Simple Svelte responsive image gallery: create a ribbon gallery, using Svelte dimension bindings to maintain the aspect ratio of all images.