flashblaze-website
DISCONTINUED
blurhash
Our great sponsors
flashblaze-website | blurhash | |
---|---|---|
1 | 41 | |
0 | 14,880 | |
- | 1.1% | |
10.0 | 5.5 | |
over 1 year ago | about 2 months ago | |
JavaScript | C | |
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.
flashblaze-website
-
Migrating my website from Gatsby to Astro
{ "name": "flashblaze-website", "private": true, "description": "Personal website of Neeraj Lagwankar", "version": "1.0.0", "author": "Neeraj Lagwankar ", "scripts": { "build": "gatsby build", "develop": "env-cmd -f .env.development gatsby develop -H 0.0.0.0", "format": "prettier --write \"**/*.{js,jsx,json,md,mdx}\"", "lint": "npm run format && eslint --fix . && echo 'Lint complete.'", "start": "npm run develop", "serve": "npm run build && gatsby serve", "clean": "gatsby clean" }, "dependencies": { "@mdx-js/mdx": "^1.6.22", "@mdx-js/react": "^1.6.22", "@supabase/supabase-js": "^1.21.1", "gatsby": "^3.11.1", "gatsby-plugin-google-analytics": "^3.11.0", "gatsby-plugin-google-fonts-v2": "^1.0.0", "gatsby-plugin-manifest": "^3.11.0", "gatsby-plugin-mdx": "^2.11.0", "gatsby-plugin-offline": "^4.11.0", "gatsby-plugin-preact": "^5.11.0", "gatsby-plugin-react-helmet": "^4.11.0", "gatsby-plugin-remove-serviceworker": "^1.0.0", "gatsby-plugin-sharp": "^3.11.0", "gatsby-plugin-sitemap": "^4.7.0", "gatsby-plugin-theme-ui": "^0.10.1", "gatsby-plugin-typography": "^3.11.0", "gatsby-remark-autolink-headers": "^4.8.0", "gatsby-remark-images": "^5.8.0", "gatsby-remark-prismjs": "^5.8.0", "gatsby-remark-relative-images": "^2.0.2", "gatsby-source-filesystem": "^3.11.0", "preact": "^10.5.14", "preact-render-to-string": "^5.1.19", "prismjs": "^1.24.1", "react": "^17.0.2", "react-dom": "^17.0.2", "react-helmet": "^6.1.0", "react-icons": "^4.2.0", "react-player": "^2.9.0", "react-spring": "^9.2.4", "react-typography": "^0.16.20", "remark-emoji": "^2.2.0", "theme-ui": "^0.10.0", "typography": "^0.16.21" }, "devDependencies": { "babel-eslint": "^10.1.0", "env-cmd": "^10.1.0", "eslint": "^7.32.0", "eslint-config-prettier": "^8.3.0", "eslint-plugin-prettier": "^3.4.0", "prettier": "^2.3.2" }, "keywords": ["gatsby", "portfolio", "flashblaze"], "repository": { "type": "git", "url": "https://github.com/flashblaze/flashblaze-website" }, "bugs": { "url": "https://github.com/flashblaze/flashblaze-website/issues" } }
blurhash
-
Generate thumbhash at edge for tiny progressive images
While it's similar to BlurHash, the color performance is much better for the same filesize. Here's a a demonstration of this from the demo page (with ThumbHash in the middle and BlurHash on the right):
-
How do you do these placeholder for loading images based on color?
+1 for blurha.sh
Take a look on blurhash also
The algorithm is even more impressive
There's also a cool lib by Wolt that creates a bit more fancy placeholders: https://github.com/woltapp/blurhash
-
How to make a hash of the images with blurhash python package and react
Package Link - https://blurha.sh
-
Migrating my website from Gatsby to Astro
No blurhash for images like Next or Gatsby
-
Blurhash: A compact representation of a placeholder for an image
The amount of work it takes to decode an image is incredibly tiny by today's standards: https://github.com/woltapp/blurhash/blob/master/C/decode.c
What are some alternatives?
thumbhash - A very compact representation of an image placeholder
flutter_gen - The Flutter code generator for your assets, fonts, colors, … — Get rid of all String-based APIs.
engine - The Flutter engine
randimage - Create random images
clipview - Titanium Module for Android ClipView
Flutter - Flutter makes it easy and fast to build beautiful apps for mobile and beyond
titaniium.android.bottomsheet
file-icons - Atom file-specific icons for improved visual grepping.
titanium-rounded-tab-group - A lightweight module to apply a native rounded tab groups (no custom view) in Appcelerator Titanium.
swup - Versatile and extensible page transition library for server-rendered websites 🎉
react-blurhash - React components for blurhash
bottom_bar_with_sheet - :rocket: Flutter custom BottomBar Navigation Widget