
Research
Two Malicious Rust Crates Impersonate Popular Logger to Steal Wallet Keys
Socket uncovers malicious Rust crates impersonating fast_log to steal Solana and Ethereum wallet keys from source code.
lqip-loader
Advanced tools
npm install --save-dev lqip-loader
Generating Base64 & dominant colours palette for a jpeg image imported in your JS bundle:
PS: The large image file will be emitted & only 400byte of Base64 (if set to true in the loader options) will be bundled.
webpack.config.js:
{
/**
* OPTION A:
* default file-loader fallback
**/
test: /\.jpe?g$/,
loaders: [
{
loader: 'lqip-loader',
options: {
path: '/media', // your image going to be in media folder in the output dir
name: '[name].[ext]', // you can use [hash].[ext] too if you wish,
base64: true, // default: true, gives the base64 encoded image
palette: true // default: false, gives the dominant colours palette
}
}
]
/**
* OPTION B:
* Chained with your own url-loader or file-loader
**/
test: /\.(png|jpe?g)$/,
loaders: [
{
loader: 'lqip-loader',
options: {
base64: true,
palette: false
}
},
{
loader: 'url-loader',
options: {
limit: 8000
}
}
]
}
your-app-module.js:
import banner from './images/banner.jpg';
console.log(banner.preSrc);
// outputs: "data:image/jpeg;base64,/9j/2wBDAAYEBQYFBAYGBQYHBwYIChAKCgkJChQODwwQFxQYGBcUFhY....
// the object will have palette property, array will be sorted from most dominant colour to the least
console.log(banner.palette) // [ '#628792', '#bed4d5', '#5d4340', '#ba454d', '#c5dce4', '#551f24' ]
console.log(banner.src) // that's the original image URL to load later!
To save memory and improve GPU performance, browsers (including Chrome started from 61.0.3163.38) will now render a slightly more crisp or pixelated Base64 encoded images.
Older Chrome to the left, Chrome v61 to the right.
If you want the blur to be smooth really bad, here's a fix!
img {
filter: blur(25px);
}
More history about the issue can be found here and here.
alternatively, you can fill the container with a really cheap colour or gradient from the amazing palette we provide.
Related projects to this would be lqip module for Node as well as lqip-cli.
Thanks to Colin van Eenige for his reviewing and early testing.
MIT - Zouhir Chahoud
FAQs
Low Quality Image Placeholders (LQIP) loader for webpack
The npm package lqip-loader receives a total of 2,444 weekly downloads. As such, lqip-loader popularity was classified as popular.
We found that lqip-loader demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 2 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Research
Socket uncovers malicious Rust crates impersonating fast_log to steal Solana and Ethereum wallet keys from source code.
Research
A malicious package uses a QR code as steganography in an innovative technique.
Research
/Security News
Socket identified 80 fake candidates targeting engineering roles, including suspected North Korean operators, exposing the new reality of hiring as a security function.