-
Notifications
You must be signed in to change notification settings - Fork 3.5k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Adds workspaces #10824
Adds workspaces #10824
Conversation
Thanks for the pull request @sanjeetsuhag!
Reviewers, don't forget to make sure that:
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Exciting, thanks @sanjeetsuhag! Here's my thoughts on an initial pass.
-
Do we still produce
Source/Cesium.js
? Since this is the recommended way to load CesiumJS in app that use build tooling, it would definitely be a breaking change if this went away in the next release without warning. At the very minimum, we should be able to provide a warning inCHANGES.md
or a deprecation period. -
Likewise, required static files such as Assets, Widget CSS, and ThirdParty are often copied from
Source
folder (for example, as recommended in cesium-webpack-example). To avoid a breaking change, we'll need to have a plan for these paths. -
Related,
package.json
will need to be edited to ensure that it is not pointing to any non-existentSource
paths. -
One thing this brings up is directory casing consistency. All the new directories are lowercase/camelcase, but that conflicts with our existing precedent of uppercase/Pascal case. This leads to some "weird" paths like
packages/engine/Source
. I imagine at least all new paths should chose one style and stick with it. Any thoughts? -
We'll need
LICENSE.md
andREADME.md
files for both packages (I didn't see at least the license file in the TODO list). I'm happy to help get content together for theREADME
s. -
Only the engine workspace creates its own build artifacts at the moment. Unsure if this is even needed or if we should just let a user's bundling tools do the job.
I think we should aim for the minimum number of build artifacts possible, at least to start. ESM is what most newer packages support.
-
For things like generating TypeScript definitions, unless we adopt a copy-paste strategy, this has the potential to increase CI time.
If we notice a major slowdown, it might be apt to only run these on CI for the main branch, but let's leave that as a last resort.
Yes,
Upon running
I think the
To run the
Yeah, for the @ggetz One public API issue is the |
I agree for existing paths (like
Is this the code in |
Oh, alright, I misunderstood. Sure, I think we can do that for the packages.
Yep. |
The root of the issue here is that the different levels of abstraction ( For |
Do you want me to drop these in this branch, or maybe open a PR into this one? |
This is strange - in 5aa0fff, one of the tests failed in CI, but it's showing up as CI passed. |
@sanjeetsuhag Is there a |
Based on the CI log, the |
@sanjeetsuhag I pushed up A few pieces of feedback and questions:
|
Thank you!
Agree on all points, I'll do another pass over all the package.json files.
Yep, as recommended by the TS docs, updated.
Yeah, I meant to refactor this too. It's been all consolidated under one
I did a lot of cleanup with
This is very interesting. Although I am not sure how best to structure this for efficiency. For comlpeteness, I think I'd like to run all the scripts for each workspace, however, that's kinda already done (to build |
@ggetz Thoughts on the latest CI run? It used 2 build stages (Tests and Deploy). The tests run the |
I'm not sure if every part of Lastly, how much benefit do we get from running the workspace tests separately from coverage? Coverage should run all tests as if they are not release tests, right? It think it would still make sense to verify the workspaces with a smokescreen test similar to the existing ESM smokescreen test. Based on the above, I think it make sense to have one job which runs prepare, the linting steps, make-zip, coverage, and deploy. In parallel, there could be another job which runs the release tests, and one which runs the workspace tests if we deem them valuable. For the parallelization to be beneficial enough to maintain, we should see a speedup in total time though. And lastly, if these changes make sense outside of the scope of adding workspaces, they should go in their own PR. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
A few thought on the CSS...
@@ -1,7 +1,7 @@ | |||
@import url(./lighterShared.css); | |||
@import url(./Animation/lighter.css); | |||
@import url(./BaseLayerPicker/lighter.css); | |||
@import url(./CesiumWidget/lighter.css); | |||
@import url(../../engine/Source/Widget/lighter.css); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Will this work when using the @cesium/widgets
package?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
As tested it seems to work.
@ggetz For documenting changes to the public API from now on, I think we should start grouping changes by workspaces in |
Correct. The github releases would be the same as before-- The code snapshot plus the generated release zip. |
This should start in the next release, right? If so, let's make that change here. Additionally, this change should be listed under The steps for bumping the package numbers in each workspace is a bit manual as it stands now. Could we automate or simplify that process at all, perhaps using the We could We could then specify a
What do you think?
Instead of repeating for each workspace, can we use the
Did you happen to add any smokescreen tests for the packages, similar to |
Ok, I'll update
I like the workflow suggested here. I'll update the Release Guide accordingly.
This was a deliberate choice to minimize the impact of issues encountered during the release process. I still think it's better to do this step by step, since we only have two workspaces to worry about right now, but I will think more about this.
Good catch. I think
I'll add those. |
That's fair. Should each command be listed in release guide then, to reduce any user error? |
When I run |
I only looked at this at a very high level and while it will take a while to get used to the new source layout, I was happy to see the mechanics of building/running themselves are largely unchanged. I'm very much looking forward to this new era of Cesium and even more modularity in the future. 🎉 That being said, the PR description seems very incomplete. I know it links out to the original discussion, but we can't expect everyone to go read the entire thread and figure out where things ended up. I would recommend editing the primary PR description to include a comprehensive summary of everything that was done and why. This basically becomes the basis for the blog post on the subject so it's very useful in the long run. Not that I have all the answers but see the two below PRs for how I've documented giant changes in the past: It's possible this change is not as big as it feels so the summary does not need to be overly long, I just feel like there are a lot of details that were left out. I've never used npm workspaces for example, so perhaps there are assumptions being made about the knowledge of the average Cesium dev? A few other questions from my first 5 minutes:
I'm sure I'll have a million more questions, and I haven't looked at the code. This is just my impression from my first 10 minutes. Nice job overall. |
Thanks for taking a look @mramato!
This is a fair point, and I'll update the PR description to include more context and be more comprehensive about the nature of the change.
This was done to allow users to have a minimal way of getting Cesium to the browser, without having the overheard of all the other elements and dependencies that
The inclusion of the built Specs was a mistake, but the omission of an IIFE bundle isn't. We're planning on shipping these smaller packages as minimally as possible, allowing users to bundle stuff as they need. The
This Cesium.d.ts.diff reveals that the only changes here, aside from the ones to
Currently, no. Users can see the package name in the file name, but that's about it:
Yes,
This actually bit us during the release process, hence the fix introduced in #10843 |
@ggetz I think we're ready for a prerelease now. Here's a very minimal wepack app that demonstrates the usage, as shown in the package READMEs.
git clean -x -d -f
npm install
npm run make-zip
npm pack --workspaces
npm install
npx webpack --config webpack.config.js
npx http-server ./dist --cors
Note: In |
This feels like something that should have it's own clean-up issue because the workaround is fine, but points to bad abstraction. |
Thanks for the update PR description @sanjeetsuhag, looks great! |
@ggetz The latest commits seem small, but are important, so I want to highlight the changes:
|
I have a couple questions, apologies if they're already covered upthread -- I tried to skim through everything but there's a lot...
|
Thanks for taking a look at this PR, @thw0rted! I was hoping to get your feedback to catch any issues, especially with the TypeScript definitions.
Yes, the
Only static assets such as images from
Yes. You can do either one of the following: import { Cartesian2 } from "@cesium/engine"; or import Cartesian2 from "@cesium/engine/Source/Core/Cartesian2.js"; |
Right now, even in main, some tooling will throw an error when importing paths that are not explicitly exported by |
@ggetz Would this still work as of the changes in 257a699 that removed the I'd also like to learn more about the motivations behind why a user might want to import a specific file instead of just the standard package import. |
Ah true, my mistake.
I'd defer that question to @thw0rted, but I expect it may have to do with tree shaking. But that should be resolved as of the use of |
Running |
Re: importing from a deep path, I wasn't especially concerned, it's just that my IDE sometimes suggests them, they work for some people, and they'll break after this change. Might at least be worth mentioning in the patch notes. |
Updated. The CesiumJS build from
|
@sanjeetsuhag Can we add a link to this PR in |
Just a suggestion and I'm not sure when we are planning to merge it, but it might make a lot of sense to squash these changes into a single commit when we are ready to merge, that way it's easy to checkout before/after the re-org in case we run into weird bugs and want to check if this is what caused it. (We could probably also just use a tag too, but I always like the cleanliness of a single PR, especially when it comes to git bisect) |
055e753: This commit removes the individual module declarations in |
@sanjeetsuhag Can you please merge in |
2c52374
to
aaf6bd8
Compare
@ggetz Pulled from main and squashed the commits. |
Awesome, thanks @sanjeetsuhag! I'll merge and then tag this change as |
CesiumJS is an extensive library with a lot of functionality that, depending on the app or use case, may go unused. Given that it is a 3D geospatial engine, some users may use the whole stack by embedding the
CesiumViewer
in their application utilizing all the features that theTimeline
andAnimation
widgets bring, some users may only want a lean interface through theCesiumWidget
and some users may only want to use the geospatial math library inCore
, for instance. Given the diversity of our user community and the domains CesiumJS is used for, the benefits of having a modularized structure of packages become increasingly apparent: users can choose to depend on only what they want to use in their application. The benefits go beyond producing a leaner bundle; it eliminates the need to install all of the direct dependencies that are synced with the existingcesium
npm package,. It also reduces the surface area of the API which the user is supposed to learn along with providing flexibility in selecting when/how they want to update their dependencies.We plan on maintaining our regular monthly release schedule for CesiumJS. Users may continue to use the combined CesiumJS release, however, anyone that would benefit from ingesting smaller, more specific packages would be able to use them when they’re released alongside the combined
cesium
package. To start, these smaller packages take the form of “engine” and “widgets”. We use npm workspaces to impose a monorepo structure. These packages can be found in the root levelpackages
directory and will be published under the@cesium
scope, i.e.@cesium/engine
and@cesium/widgets
. As compared to the combined CesiumJS package, which includes pre-bundled artifacts such asCesium.js
,index.js
andindex.cjs
, these newer packages will be shipped in a lean configuration, as ES modules with TypeScript definitions, as is the standard for modern packages. This will allow users to employ the bundling tools of their choice for their applications and take advantage of features like tree-shaking, or dead code elimination. Also, as per npm best practice, these packages will follow semantic versioning, which let users clearly understand the scope of changes between versions and prevent cases where allowing npm to automatically update versions would result in broken builds.The engine package is the core runtime components of CesiumJS, including everything except the Widgets folder found in the combined CesiumJS release. The one exception here is that CesiumWidget has been moved from the
widgets
toengine
. This provides a lean and minimal way of adding CesiumJS to the browser. So, if you’re only using the engine package, you can get started with the following snippet:The widgets package contains all the different UI widgets that are part of the combined CesiumJS package. These include the
Viewer
.Timeline
,Animation
etc. along with the different mixins. To get started with thewidgets
package, you can use the following snippet:Since
widgets
depends onengine
, theengine
package will automatically be installed when you installwidgets
.In terms of what these changes look like in the repository or the combined release, all source files from the root level
Source
folder have been moved into the respective package folder. For example,Scene.js
has moved fromSource/Scene/Scene.js
topackages/engine/Source/Scene/Scene.js
. AndViewer.js
has moved fromSource/Widgets/Viewer/Viewer.js
topackages/widgets/Source/Viewer/Viewer.js
. Any direct dependencies included in the source code have been moved to theThirdParty
folder within each package’sSource
folder.When working within the repository, each package also comes with it’s own simple scripts:
build
- Creates the package’s entry moduleindex.js
, bundles the Specsbuild-ts
- Generates the TypeScript definitions filetest
- Runs testscoverage
- Generates coverage reportTo minimize impact on applications that depend on the combined CesiumJS release structure, static assets found in
Assets
,ThirdParty
andWidgets
are still copied to the root levelSource
folder at the time of publishing.These changes are another important step of our plan to continue modernizing the CesiumJS library and it builds on the previous improvements to our source code, tooling and build processes. In the future, we hope to be able to break the packages down along even finer lines, such as publishing a
core
package that contains all the geospatial math classes likeCartesian3
etc.Folder Structure Changes
packages/engine/Source
orpackage/widgets/Source
.packages/engine/Specs
orpackage/widgets/Specs
.CesiumWidget
has been moved topackages/engine/Source/Widget
, as opposed topackages/widgets/Source
.createScene
remain in the root levelSpecs
folder, along withData
.Testing
npm run test
or testing using Jasmine from the browser still work the same way.karma-main.js
with theSpecList.js
to generate an ESM bundle for testing with Karma.npm run test --workspaces
ornpm run test -w @cesium/widgets
allow for testing workspace specs.Assets
,ThirdParty
etc) are server fromBuild/CesiumUnminified
.TypeScript
Source/Cesium.d.ts
remains unchanged.index.d.ts
file using its owntsd-conf.json
file.@cesium/engine
are imported into@cesium/widgets
.KmlTour.prototype.play
function takes in aViewer
parameter, which is now in@cesium/widgets
, a manual type definition is added to theindex.d.ts
:CI
Build Artifacts
Cesium
andCesiumUnminified
remain unchanged.Source
folder to import static assets, theAssets
,ThirdParty
,Widgets
(only the CSS files) andWorkers
are copied into theSource
folder.index.js
index.d.ts
README.md
LICENSE.md
Source
Build/Workers
Build/ThirdParty
index.js
index.d.ts
README.md
LICENSE.md
Source
Release Process
0.1.0
as as prerelease version.CHANGES.md
should be grouped by workspaces.Status
index.js
for each packagetypes.d.ts
for each packagebuild
for each packagetest
working for packagestest
working for CesiumJSApps
/Sandcastle
workinggulpfile.js
/build.js
/server.js
package.json
and dev documentationPackage Consumption Tests
create-react-app
cesium
repository, run the following command:config/webpack.config.json
file and add the following plugins:You should be able to use the
CesiumWidget
orCesiumViewer
in your React app.