sass-site/source/blog/032-embedded-sass-is-live.md

77 lines
3.7 KiB
Markdown
Raw Normal View History

---
2023-03-09 17:19:39 +01:00
title: "Embedded Sass is Live"
author: Natalie Weizenbaum
2023-03-03 16:39:31 +01:00
date: 2022-02-01 2:00:00 -8
---
After several years of planning and development, I'm excited to finally announce
the stable release of Embedded Dart Sass along with its first official wrapper,
the [`sass-embedded`] package available now on npm!
[`sass-embedded`]: https://www.npmjs.com/package/sass-embedded
Embedded Sass is an ongoing effort to make a highly-performant Sass library
available to as many different languages as possible, starting with Node.js.
Although Node.js already has access to the pure-JS `sass` package, the nature of
JavaScript inherently limits how quickly this package can process large Sass
files especially in asynchronous mode. We expect `sass-embedded` to be a major
boon to developers for whom compilation speed is a concern, particularly the
remaining users of `node-sass` for whom performance has been a major reason to
avoid Dart Sass.
The `sass-embedded` package fully supports the [new JS API] as well as the
[legacy API] other than a few cosmetic options. You can use it as a drop-in
replacement for the `sass` package, and it should work with all the same build
plugins and libraries. Note that `sass-embedded` is a bit faster in
2023-03-09 17:19:39 +01:00
*asynchronous* mode than it is in synchronous mode (whereas the `sass` package
was faster in synchronous mode). For substantial Sass files, running
`sass-embedded` in either mode will generally be much faster than `sass`.
2023-06-09 04:18:33 +02:00
[new JS API]: /documentation/js-api/#md:usage
[legacy API]: /documentation/js-api/#md:legacy-api
In order to limit the confusion about which version of which package supports
which feature, the `sass-embedded` package will always have the same version as
the `sass` package. When new features are added to the JS API, they'll be
supported at the same time in both packages, and when new language features are
added to Sass they'll always be included in a new `sass-embedded` release
straight away.
## How it Works
Embedded Sass is composed of three parts:
1. [The compiler], a Dart executable that wraps Dart Sass and does the actual
heavy lifting of parsing and compiling the files. Dart native executables are
generally much faster than JavaScript, so using them for the
computationally-intensive work of stylesheet evaluation is where Embedded
Sass gets its speed.
2. [The host], a library in any language (in this case JavaScript) that provides a
usable end-user API for invoking the compiler. The host provides callers with
configuration options, including the ability to define custom importers and
Sass functions that are used by the compilation.
3. [The protocol], a [protocol-buffer]-based specification of how the host and
the compiler communicate with one another. This communication happens over
the standard input and output streams of the compiler executable, which is
invoked by the host to perform each compilation.
[The compiler]: https://github.com/sass/dart-sass-embedded
[The host]: https://github.com/sass/embedded-host-node
[The protocol]: https://github.com/sass/embedded-protocol
[protocol-buffer]: https://en.wikipedia.org/wiki/Protocol_Buffers
## Other Languages
Embedded Sass was designed in part as a way for languages other than JavaScript
to have access to the full power of Sass compilation with custom importers and
functions, similarly to how C++ wrappers for [LibSass] worked in the past. We
hope that community members will use this protocol to implement embedded hosts
for many other popular frontend languages. If you end up doing so, message us
[on Twitter] or [Gitter] and we'll link it on this site!
2023-06-09 04:18:33 +02:00
[LibSass]: /libsass
[on Twitter]: https://twitter.com/SassCSS
[Gitter]: https://gitter.im/sass/sass