@sveltia/cms 0.67.1 → 0.69.0

package/README.md

@@ -67,6 +67,7 @@ The free, open source alternative to Netlify/Decap CMS is now in public beta, tu
   - [Disabling non-default locale content](#disabling-non-default-locale-content)
   - [Using a random ID for an entry slug](#using-a-random-id-for-an-entry-slug)
   - [Configuring multiple media libraries](#configuring-multiple-media-libraries)
+  - [Optimizing images for upload](#optimizing-images-for-upload)
   - [Editing data files with a top-level list](#editing-data-files-with-a-top-level-list)
   - [Changing the input type of a DateTime field](#changing-the-input-type-of-a-datetime-field)
   - [Controlling data output](#controlling-data-output)
@@ -78,6 +79,7 @@ The free, open source alternative to Netlify/Decap CMS is now in public beta, tu
 - [Roadmap](#roadmap)
   - [Before the 1.0 release](#before-the-10-release)
   - [After the 1.0 release](#after-the-10-release)
+- [Trivia](#trivia)
 - [Related links](#related-links)
   - [As seen on](#as-seen-on)
 - [Disclaimer](#disclaimer)
@@ -102,8 +104,6 @@ Sveltia CMS is the only project that doesn’t inherit the complexity, technical
 
 While Sveltia CMS is specifically designed to replace legacy Netlify CMS instances, it also aims to serve as a substitute for the other Netlify CMS successors. We hope that, especially with the [robust i18n support](#better-i18n-support), our product will eventually become an attractive choice for anyone looking for a free headless CMS.
 
-Trivia: The [original version of Netlify CMS](https://github.com/netlify/netlify-cms-legacy) was built with Ember before being rewritten in React. And now we are completely rewriting it in Svelte. So this is effectively the second time the application has gone through a framework migration.
-
 ### Our goals
 
 - Making Sveltia CMS a viable, definitive successor to Netlify CMS
@@ -116,12 +116,12 @@ Trivia: The [original version of Netlify CMS](https://github.com/netlify/netlify
 
 Sveltia CMS is currently in **beta** and version 1.0 (GA) is expected to ship in mid-2025. Check our [release notes](https://github.com/sveltia/sveltia-cms/releases) for updates. See also our [roadmap](#roadmap).
 
-While we fix reported bugs as quickly as possible, usually within 24 hours, our overall progress may be slower than you think. The thing is, it’s not just a personal project of [@kyoshino](https://github.com/kyoshino), but also involves different kinds of activities that require considerable effort:
+While we fix reported bugs as quickly as possible, usually within 24 hours, our overall progress may be slower than you think. The thing is, it’s not just a personal project of [@kyoshino](https://github.com/kyoshino), but also a complicated system that involves various kinds of activities that require considerable effort:
 
 - Ensuring substantial [compatibility with Netlify/Decap CMS](#compatibility)
 - Providing partial [compatibility with Static CMS](#compatibility-with-static-cms)
 - Tackling as many [Netlify/Decap CMS issues](https://github.com/decaporg/decap-cms/issues) as possible
-  - So far, 185+ issues, or 375+ if including duplicates, have been effectively solved in Sveltia CMS
+  - So far, 190+ issues, or 380+ if including duplicates, have been effectively solved in Sveltia CMS
   - Target:
     - 200 issues, or 400 if including duplicates, by GA (almost there)
     - 350 issues, or 600 if including duplicates, in the future
@@ -133,7 +133,7 @@ While we fix reported bugs as quickly as possible, usually within 24 hours, our
 - Responding to requests from the maintainer’s clients
 - Making the code clean and maintainable
 
-![185 Netlify/Decap CMS Issues Solved in Sveltia CMS](https://raw.githubusercontent.com/sveltia/sveltia-cms/main/docs/headline-1.webp?20250327)<br>
+![190 Netlify/Decap CMS Issues Solved in Sveltia CMS](https://raw.githubusercontent.com/sveltia/sveltia-cms/main/docs/headline-1.webp?20250403)<br>
 
 ## Differentiators
 
@@ -228,7 +228,7 @@ We hope Netlify/Decap CMS users will be pleased and surprised by the numerous im
 - Users won’t get a 404 Not Found error when you sign in to the GitLab backend.[^115]
 - Features the all-new local backend that boosts DX. See the [productivity section](#better-productivity) above.
 - Developers can select the local and remote backends while working on a local server.
-- The Test backend saves entries and assets in the browser’s [origin private file system](https://web.dev/articles/origin-private-file-system) (OPFS) so that changes are not discarded when the browser tab is closed or reloaded.[^194]
+- The Test backend saves entries and assets in the browser’s [origin private file system](https://web.dev/articles/origin-private-file-system) (OPFS) so that changes are not discarded when the browser tab is closed or reloaded.[^194] The persistent storage is not yet supported in Safari.
 
 ### Better i18n support
 
@@ -366,6 +366,7 @@ Sveltia CMS has been built with a multilingual architecture from the very beginn
 - Code
   - More than 300 languages are available, thanks to [Prism](https://prismjs.com/)’s extensive language support.
   - The language switcher always appears in the user interface, so it’s easy to spot and change the selected language.
+  - Dynamic loading of language modes work as expected.[^198]
   - Code fields under a List field work as expected, saving both code and language.[^181]
 - Color
   - The widget doesn’t cause scrolling issues.[^128]
@@ -477,6 +478,7 @@ Sveltia CMS has been built with a multilingual architecture from the very beginn
   - Sort or filter assets by name or file type.
   - View asset details, including size, dimensions, commit author/date and a list of entries that use the selected asset.
 - Enhancements to media library integrations:
+  - The default media library comes with a [built-in image optimizer](#optimizing-images-for-upload). With a few lines of configuration, images uploaded by users are automatically converted to WebP format for reduced size,[^199] and it’s also possible to specify a maximum width and/or height.[^200] SVG images can also be optimized.
   - Supports multiple media libraries with the [new `media_libraries` option](#configuring-multiple-media-libraries).[^195]
   - The `max_file_size` option for the File/Image widget can be defined within the global `media_library` option, using `default` as the library name. It applies to all File/Image entry fields, as well as direct uploads to the Asset Library. The option can also be part of the [new `media_libraries` option](#configuring-multiple-media-libraries).
 - The global `media_folder` can be an empty string (or `.` or `/`) if you want to store assets in the root folder.
@@ -577,6 +579,7 @@ Sveltia CMS provides partial compatibility with [Static CMS](https://github.com/
 ### Other notes
 
 - Make sure you’re using the latest stable version of a modern web browser. Firefox ESR and its derivatives, including Tor Browser and Mullvad Browser, are not officially supported, although they may still work. The [local repository workflow](#working-with-a-local-git-repository) requires Chrome, Edge or another Chromium-based browser.
+- The persistent storage for the Test backend is not yet supported in Safari.
 - Sveltia CMS requires a [secure context](https://developer.mozilla.org/en-US/docs/Web/Security/Secure_Contexts), meaning it only works with HTTPS, `localhost` or `127.0.0.1` URLs. If you’re running a remote server yourself and the content is served over HTTP, get a TLS certificate from [Let’s Encrypt](https://letsencrypt.org/).
 - The GitLab backend requires GitLab 16.3 or later.
 - Found a compatibility issue or other missing feature? [Let us know](https://github.com/sveltia/sveltia-cms/issues/new?labels=bug). Bear in mind that undocumented behaviour can easily be overlooked.
@@ -824,7 +827,7 @@ Note that the Translation button on the pane header only translates empty fields
 If you have upgraded to DeepL API Pro, provide your new Authentication Key:
 
 1. Click the Account button in the upper right corner, then click Settings.
-1. Select the Language tab.
+1. Select the Contents tab.
 1. Replace your free API key ending with `:fx` with the new paid API key in the DeepL API Authentication Key field.
 1. Close the Settings dialog.
 
@@ -943,7 +946,8 @@ media_libraries:
   default:
     config:
       max_file_size: 1024000
-      # coming soon: image optimizer options
+      transformations:
+        # See the next section
   cloudinary:
     config:
       cloud_name: YOUR_CLOUD_NAME
@@ -957,6 +961,36 @@ media_libraries:
       defaultOperations: '/resize/800x600/'
 ```
 
+### Optimizing images for upload
+
+Ever wanted to prevent end-users from adding huge images to your repository? The built-in optimizer in Sveltia CMS makes developers’ lives easier with a simple configuration like this:
+
+```yaml
+media_libraries:
+  default:
+    config:
+      transformations:
+        raster_image: # original format
+          format: webp # new format, only `webp` is supported
+          quality: 85 # default: 85
+          width: 2048 # default: original size
+          height: 2048 # default: original size
+        svg:
+          optimize: true
+```
+
+Then, whenever a user selects images to upload, those images are automatically optimized, all within the browser. Raster images such as PNG and JPEG are automatically converted to WebP format and resized if necessary. SVG images are minified using the [SVGO](https://github.com/svg/svgo) library.
+
+In case you’re not aware, [WebP](https://developers.google.com/speed/webp) offers better compression than JPEG and PNG and is now [widely supported](https://caniuse.com/webp) across major browsers. So there is no reason not to use WebP on the web.
+
+- As [noted above](#configuring-multiple-media-libraries), the `media_libraries` option can be global at the root level of `config.yml`, which applies to both entry fields and the Asset Library, or field-specific for the File/Image widgets.
+- `raster_image` applies to any supported raster image format: `avif`, `bmp`, `gif`, `jpeg`, `png` and `webp`. If you like, you can use a specific format as key instead of `raster_image`.
+- The `width` and `height` options are the maximum width and height, respectively. If an image is larger than the specified dimension, it will be scaled down. Smaller images will not be resized.
+- File processing is a bit slow on Safari because [native WebP encoding](https://caniuse.com/mdn-api_htmlcanvaselement_toblob_type_parameter_webp) is not yet supported and a [third-party library](https://github.com/jamsinclair/jSquash) is used instead.
+- AVIF conversion is not supported at this time because no browser has native encoding support and the library is very slow.
+- This feature is not intended for creating image variants in different formats and sizes. It should be done with a framework during the build process.
+- We may add more transformation options in the future.
+
 ### Editing data files with a top-level list
 
 Sveltia CMS allows you to edit and save a list at the top-level of a data file, without a field name. All you need to do is create a single List field with the new `root` option set to `true`. The configuration below reproduces [this Jekyll data file example](https://jekyllrb.com/docs/datafiles/#example-list-of-members):
@@ -1211,6 +1245,10 @@ See [Contributing to Sveltia CMS](https://github.com/sveltia/sveltia-cms/blob/ma
 - Official starter templates for the most popular frameworks, including SvelteKit and Next.js
 - and so much more!
 
+## Trivia
+
+- The [original version of Netlify CMS](https://github.com/netlify/netlify-cms-legacy) was built with Ember before being rewritten in React. And now we are completely rewriting it in Svelte. So this is effectively the second time the application has gone through a framework migration.
+
 ## Related links
 
 - Introducing Sveltia CMS: a short technical presentation by [@kyoshino](https://github.com/kyoshino) during the _This Week in Svelte_ online meetup on March 31, 2023 — [recording](https://youtu.be/-YjLubiieYs?t=1660) & [slides](https://docs.google.com/presentation/d/1Wi4ty-1AwOp2-zy7LctmzCV4rrdYPfke9NGhO0DdRdM)
@@ -1619,3 +1657,9 @@ This software is provided “as is” without any express or implied warranty. W
 [^196]: Netlify/Decap CMS [#3057](https://github.com/decaporg/decap-cms/issues/3057) — We use Svelte though.
 
 [^197]: Netlify/Decap CMS [#3457](https://github.com/decaporg/decap-cms/issues/3457), [#3624](https://github.com/decaporg/decap-cms/issues/3624)
+
+[^198]: Netlify/Decap CMS [#7442](https://github.com/decaporg/decap-cms/issues/7442)
+
+[^199]: Netlify/Decap CMS [#5419](https://github.com/decaporg/decap-cms/issues/5419), [#7107](https://github.com/decaporg/decap-cms/issues/7107)
+
+[^200]: Netlify/Decap CMS [#1322](https://github.com/decaporg/decap-cms/issues/1322), [#6442](https://github.com/decaporg/decap-cms/issues/6442)