-
Notifications
You must be signed in to change notification settings - Fork 2
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Deploying to gh-pages from @ 4d2a243 🚀
- Loading branch information
Showing
13 changed files
with
462 additions
and
348 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,87 @@ | ||
<!DOCTYPE HTML><html xmlns="http://www.w3.org/1999/xhtml"> | ||
<head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"> | ||
|
||
<title>Packaging SaxonJS for the browser</title> | ||
<meta name="author" content="Norm Tovey-Walsh"> | ||
<meta name="pubdate" content="2024-08-16T15:20:00"> | ||
<link rel="shortcut icon" href="/img/scicon-032.png" type="image/png"> | ||
<style>pre code { font-size: 90%; } | ||
.aside { width: 50%; float: right; | ||
padding-left: 1em; padding-right: 1em; margin-top: 0.25em; | ||
margin-left: 1em; margin-bottom: 0.25em; | ||
border: 1px solid #cccccc; border-radius: 0.5em; } | ||
.aside em { font-weight: bold; font-style: normal; } | ||
</style> | ||
<link rel="stylesheet" type="text/css" href="/css/blog.css"><link rel="stylesheet" type="text/css" href="/css/norm-tovey-walsh.css"><meta content="Saxon Chronicles (in a Norman style)" property="og:site_name"><meta content="https://blog.saxonica.com/img/sccard.png" property="og:image"><meta content="Norm Tovey-Walsh's Saxonica weblog." property="og:description"><meta content="https://blog.saxonica.com/norm" property="og:url"><meta content="600" property="og:image:width"><meta content="315" property="og:image:height"><meta content="Packaging SaxonJS for the browser" property="og:title"><meta content="en_GB" property="og:locale"><meta content="website" property="og:type"><meta name="viewport" content="width=device-width, initial-scale=1.0"></head> | ||
<body class="norm-tovey-walsh"><header><div class="banner"><h1><a href="/norm/">Saxon Chronicles</a></h1><div class="tagline">( in a Norman style )</div></div><h2>Packaging SaxonJS for the browser</h2><aside class="nav"><div class="navlinks"><div id="search"><form action="https://www.google.com/search" target="_parent"><span>Search: </span><input size="20" name="as_q"><input type="hidden" name="hl" value="en"><input type="hidden" name="ie" value="UTF-8"><input type="hidden" name="btnG" value="Google+Search"><input type="hidden" name="as_qdr" value="all"><input type="hidden" name="as_occt" value="any"><input type="hidden" name="as_dt" value="i"><input type="hidden" name="as_sitesearch" value="blog.saxonica.com"></form></div><div id="blogroll"><a href="/">Home (combined archives)</a><br><a href="/announcements/">Announcements</a><br><a href="/mike/">Saxon diaries</a><br><a href="/oneil/">O’Neil Delpratt’s Blog</a><br><a href="/norm/">Saxon Chronicles</a></div></div></aside><div class="byline"><span class="by">By </span><span class="name"><a href="/authors.html#norm-tovey-walsh">Norm Tovey-Walsh</a></span><span class="on"> on </span><a href="/authors.html#norm-tovey-walsh-D2024-08"><span class="date" time="2024-08-16T15:20:00">August 16, 2024 at 03:20p.m.</span></a></div></header><main> | ||
|
||
|
||
<p>Over the years, there have been several requests to improve the way that | ||
SaxonJS is packaged for the browser. In the run up towards SaxonJS 3.0 (real | ||
soon now, I promise), I’ve spent a few hours trying to see if that’s possible.</p> | ||
|
||
<p>For SaxonJS on Node.js, things seem to be working the way users expect. You | ||
can install SaxonJS, and <em>xslt3.js</em>, the command-line XSLT processor, | ||
with <code>npm install</code>. Then you can use them as you would other Node.js | ||
modules and applications.</p> | ||
|
||
<p>For the browser, things are a little less clear.</p> | ||
|
||
<p>I’ll start out by observing that SaxonJS is a large(ish) collection of mostly | ||
plain JavaScript files. There are a mixture of techniques used, as you might | ||
expect from a code base that stretches back seven or eight years (roughly ∞ in | ||
JavaScript years). This code is compiled by the <a href="https://developers.google.com/closure/compiler">Closure Compiler</a> to | ||
produce the release artifacts.</p> | ||
|
||
<div class="aside"> | ||
<p><em>Aside:</em> Producing TypeScript instead of JavaScript is almost certainly | ||
impractical. And | ||
the answer to the question, “can you make it an ESM module?” appears to be “no”. But | ||
maybe I’m wrong?</p> | ||
</div> | ||
|
||
<p>Almost anything is <em>possible</em> in software, | ||
but there some things are probably <em>impractical</em> because of how SaxonJS | ||
is built. | ||
</p> | ||
|
||
<p>What I’ve come to realize after several hours is that I | ||
don’t actually understand what problem I’m trying to solve. That usually makes | ||
problems harder.</p> | ||
|
||
<p>For example, it would be easy to package the browser versions of the SaxonJS | ||
libraries into the <code>saxon-js</code> <em>npm</em> package. That would allow | ||
you to use <code>npm install</code> to install it. Once installed, you could | ||
refer to it in HTML like this:</p> | ||
|
||
<pre><code><script src="node_modules/saxon-js/SaxonJS3.rt.js"></script></code></pre> | ||
|
||
<p>That’s a non-zero usability improvement over downloading the browser release | ||
yourself and adding it to your project, but it’s an <em>awfully small</em> | ||
improvement. So small, that I conjecture that the request to “put it in the npm | ||
package” means more than that. But I don’t know what more.</p> | ||
|
||
<p>Another request that’s come up a couple of times is whether we should provide | ||
a version that’s been packaged up with <em>webpack</em>. Well. Okay. I spent | ||
a bit of time on that and eventually I managed to get</p> | ||
|
||
<pre><code>npx webpack --config webpack.config.js</code></pre> | ||
|
||
<p>to take <code>src/SaxonJS3.js</code>, chew on it for a while, and produce | ||
<code>dist/SaxonJS3.js</code>. That was a little, uh, underwhelming. I started | ||
with a JavaScript library that I could load in the browser and ended with…a | ||
different one, I guess?</p> | ||
|
||
<p>Then there are suggestions that instead of <em>webpack</em> I should be | ||
trying <em>vite</em> or <em>bun</em> or something else and do I also need | ||
<em>browserify</em>? I don’t know. | ||
I’m about to give up, at least in the short term, but before I do, I thought | ||
I’d see if anyone out there can tell me what I’m missing.</p> | ||
|
||
<p>If you would like to see SaxonJS for the browser packaged up in some | ||
different way, can you tell me how? And why? A small test case would be ideal: | ||
something that isn’t too complicated, that doesn’t work with SaxonJS as it’s | ||
distributed today, that would work if we packaged it in some other way.</p> | ||
|
||
</main><footer><div class="prev-uri"><a href="/mike/2024/08/maps-and-records.html">Maps and Records</a></div></footer></body> | ||
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,9 @@ | ||
<!DOCTYPE HTML><html xmlns="http://www.w3.org/1999/xhtml"> | ||
<head> | ||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> | ||
<meta http-equiv="Refresh" content="0; url=/norm/2024/08/16-packaging.html"> | ||
<title>Redirect</title> | ||
</head> | ||
<body><a href="/norm/2024/08/16-packaging.html">Redirect</a>. | ||
</body> | ||
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,9 @@ | ||
<!DOCTYPE HTML><html xmlns="http://www.w3.org/1999/xhtml"> | ||
<head> | ||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> | ||
<meta http-equiv="Refresh" content="0; url=/norm/2024/08/16-packaging.html"> | ||
<title>Redirect</title> | ||
</head> | ||
<body><a href="/norm/2024/08/16-packaging.html">Redirect</a>. | ||
</body> | ||
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.