@css-inline/css-inline - npm Package Compare versions

Comparing version 0.13.2 to 0.14.0

index.d.ts

@@ -32,1 +32,3 @@ /* tslint:disable */
 export function inline(html: string, options?: Options | undefined | null): string
+/** Inline CSS styles into an HTML fragment. */
+export function inlineFragment(html: string, css: string, options?: Options | undefined | null): string

index.js

@@ -255,4 +255,5 @@ /* tslint:disable */
 
-const { inline } = nativeBinding
+const { inline, inlineFragment } = nativeBinding
 
 module.exports.inline = inline
+module.exports.inlineFragment = inlineFragment

js-binding.d.ts

@@ -6,2 +6,6 @@ /* tslint:disable */
 
+export interface StylesheetCache {
+  /** Cache size. */
+  size: number
+}
 export interface Options {
@@ -23,2 +27,4 @@ /**
   loadRemoteStylesheets?: boolean
+  /** An LRU Cache for external stylesheets. */
+  cache?: StylesheetCache
   /** Additional CSS to inline. */
@@ -34,3 +40,5 @@ extraCss?: string
 export function inline(html: string, options?: Options | undefined | null): string
+/** Inline CSS styles into an HTML fragment. */
+export function inlineFragment(html: string, css: string, options?: Options | undefined | null): string
 /** Get the package version. */
 export function version(): string

js-binding.js

@@ -284,5 +284,6 @@ /* tslint:disable */
 
-const { inline, version } = nativeBinding
+const { inline, inlineFragment, version } = nativeBinding
 
 module.exports.inline = inline
+module.exports.inlineFragment = inlineFragment
 module.exports.version = version

package.json

 {
   "name": "@css-inline/css-inline",
-  "version": "0.13.2",
+  "version": "0.14.0",
   "description": "High-performance library for inlining CSS into HTML 'style' attributes",
@@ -101,13 +101,13 @@ "main": "index.js",
   "optionalDependencies": {
-    "@css-inline/css-inline-win32-x64-msvc": "0.13.2",
-    "@css-inline/css-inline-darwin-x64": "0.13.2",
-    "@css-inline/css-inline-linux-x64-gnu": "0.13.2",
-    "@css-inline/css-inline-darwin-arm64": "0.13.2",
-    "@css-inline/css-inline-linux-arm64-gnu": "0.13.2",
-    "@css-inline/css-inline-linux-arm64-musl": "0.13.2",
-    "@css-inline/css-inline-linux-arm-gnueabihf": "0.13.2",
-    "@css-inline/css-inline-linux-x64-musl": "0.13.2",
-    "@css-inline/css-inline-android-arm64": "0.13.2",
-    "@css-inline/css-inline-android-arm-eabi": "0.13.2"
+    "@css-inline/css-inline-win32-x64-msvc": "0.14.0",
+    "@css-inline/css-inline-darwin-x64": "0.14.0",
+    "@css-inline/css-inline-linux-x64-gnu": "0.14.0",
+    "@css-inline/css-inline-darwin-arm64": "0.14.0",
+    "@css-inline/css-inline-linux-arm64-gnu": "0.14.0",
+    "@css-inline/css-inline-linux-arm64-musl": "0.14.0",
+    "@css-inline/css-inline-linux-arm-gnueabihf": "0.14.0",
+    "@css-inline/css-inline-linux-x64-musl": "0.14.0",
+    "@css-inline/css-inline-android-arm64": "0.14.0",
+    "@css-inline/css-inline-android-arm-eabi": "0.14.0"
   }
 }

README.md

@@ -40,2 +40,3 @@ # css-inline
 - Resolves external stylesheets (including local files)
+- Optionally caches external stylesheets
 - Works on Linux, Windows, and macOS
@@ -79,2 +80,37 @@ - Supports HTML5 & CSS3
 
+Note that `css-inline` automatically adds missing `html` and `body` tags, so the output is a valid HTML document.
+
+Alternatively, you can inline CSS into an HTML fragment, preserving the original structure:
+
+```javascript
+import { inlineFragment } from "@css-inline/css-inline";
+
+var inlined = inlineFragment(
+  `
+  <main>
+    <h1>Hello</h1>
+    <section>
+      <p>who am i</p>
+    </section>
+  </main>
+  `,
+  `
+  p {
+      color: red;
+  }
+
+  h1 {
+      color: blue;
+  }
+  `
+);
+// HTML becomes this:
+// <main>
+// <h1 style="color: blue;">Hello</h1>
+// <section>
+// <p style="color: red;">who am i</p>
+// </section>
+// </main>
+```
+
 ### Configuration
@@ -87,2 +123,3 @@
 - `loadRemoteStylesheets`. Specifies whether remote stylesheets should be loaded. Default: `true`
+- `cache`. Specifies caching options for external stylesheets (for example, `{size: 5}`). Default: `null`
 - `extraCss`. Extra CSS to be inlined. Default: `null`
@@ -131,2 +168,25 @@ - `preallocateNodeCapacity`. **Advanced**. Preallocates capacity for HTML nodes during parsing. This can improve performance when you have an estimate of the number of nodes in your HTML document. Default: `32`
 
+You can also cache external stylesheets to avoid excessive network requests:
+
+```typescript
+import { inline } from "@css-inline/css-inline";
+
+var inlined = inline(
+  `
+  <html>
+    <head>
+      <link href="http://127.0.0.1:1234/external.css" rel="stylesheet">
+      <style>h1 { color:red }</style>
+    </head>
+    <body>
+      <h1>Test</h1>
+    </body>
+  </html>
+  `,
+  { cache: { size: 5 } },
+);
+```
+
+Caching is disabled by default.
+
 ## WebAssembly
@@ -155,3 +215,3 @@
 
-**NOTE**: WASM module currently lacks support for fetching stylesheets from network or filesystem.
+**NOTE**: WASM module currently lacks support for fetching stylesheets from network or filesystem and caching.
 
@@ -165,11 +225,11 @@ ## Performance
 
-|             | Size    | `css-inline 0.13.0` | `css-inline-wasm 0.13.0` | `juice 10.0.0`       | `inline-css 4.0.2`   |
-|-------------|---------|---------------------|--------------------------|----------------------|----------------------|
-| Basic       | 230 B   | 15.34 µs            | 19.99 µs (**1.30x**)     | 56.70 µs (**3.69x**) | 67.95 µs (**4.42x**) |
-| Realistic-1 | 8.58 KB | 333.22 µs           | 434.59 µs (**1.30x**)    | 1.07 ms (**3.23x**)  | 1.24 ms (**3.73x**)  |
-| Realistic-2 | 4.3 KB  | 195.80 µs           | 261.09 µs (**1.33x**)    | 0.99 ms (**5.10x**)  | 0.76 ms (**3.90x**)  |
+|             | Size    | `css-inline 0.14.0` | `css-inline-wasm 0.13.0` | `juice 10.0.0`        | `inline-css 4.0.2`   |
+|-------------|---------|---------------------|--------------------------|-----------------------|----------------------|
+| Basic       | 230 B   | 16.82 µs            | 20.92 µs (**1.24x**)     | 57.00 µs (**3.38x**)  | 68.43 µs (**4.06x**) |
+| Realistic-1 | 8.58 KB | 351.74 µs           | 452.28 µs (**1.28x**)    | 859.10 µs (**2.44x**) | 1.04 ms (**2.98x**)  |
+| Realistic-2 | 4.3 KB  | 203.25 µs           | 269.54 µs (**1.32x**)    | 1.02 ms (**5.04x**)   | 861.32 µs (**4.23x**)  |
 
 The "Basic" case was obtained from benchmarking the example from the Usage section.
 
-The benchmarking code is available in the `benches/bench.ts` file. The benchmarks were conducted using the stable `rustc 1.75.0` on Node.js `v21.1.0`.
+The benchmarking code is available in the `benches/bench.ts` file. The benchmarks were conducted using the stable `rustc 1.77.1` on Node.js `v21.1.0`.
 
@@ -176,0 +236,0 @@ ## License

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

30703

increased by6.27%

Lines of code

598

increased by2.05%

Number of lines in readme file

233

increased by34.68%

No dependency changes