Commit graph

257 commits

Author SHA1 Message Date
Cole Lawrence
58f04685ad r3f: Accept function for objRef like for setState 2022-07-25 12:01:26 -04:00
Cole Lawrence
415e493834 doc: Add doc to Ticker.raf 2022-07-25 12:01:26 -04:00
Cole Lawrence
a48155f8dc r3f readme: Update with corrected API 2022-07-25 12:01:26 -04:00
Cole Lawrence
5ca3edead8 dev: Fix r3f tsconfig to include TSX files 2022-07-25 12:01:26 -04:00
Cole Lawrence
11b5d175f4
Fix github checks (#263)
* Update dependencies which pass tests locally

* Break the yarn cache in an attempt to fix checks

* playground: Add wrapping error info for build.ts

* playground: Don't use dev mode in CI tests

* playground: Use tsc for typecheck

* playground: Specify working esbuild version 0.13.15

* playground: Use only promises in build.ts

* playground: Ensure serving in ci e2e

 * Add echo for vercel for build:static
2022-07-25 10:37:34 +02:00
Aria Minaei
a8176a36f7 0.5.0-rc.3 2022-07-12 18:37:04 +02:00
Aria Minaei
00a039a713 Fix exports of @theatre/r3f so it is consistently interpreted across bundlers
Before this commit, the exports field of `@theatre/r3f` was:

```
"exports": {
  ".": "./dist/index.js",
  "./extension": "./dist/extension/index.js"
 },
 ```
So users could import the extension from '@theatre/r3f/extension'

However, if the user’s bundler doesn’t support the exports field, they’d have to import from @theatre/r3f/dist/extension. There are 3 problems with this approach:

1. We have to ask users to try both paths and see which works for their bundler.
2. Users can’t copy code from each other if their bundler setups are different.
3. To make matters worse, if a user’s bundler supports exports, they can’t import from @theatre/r3f/dist/extension.

This is all confusing, so we're fixing it by exposing @theatrer/3f/dist/extension and not @theatre/r3f/extension. Uglier, but more consistent, and avoids the above 3 problems.
2022-07-12 17:49:09 +02:00
Aria Minaei
667f9d4fa2 Massive perf-gain in @theatre/react
Remove cold derivation reads

Prior to this commit, the first render of every `useDerivation()` resulted in a cold read of its inner derivation. Cold reads are predictably slow. The reason we'd run cold reads was to comply with react's rule of not running side-effects during render. (Turning a derivation hot is _technically_ a side-effect).

However, now that users are animating scenes with hundreds of objects in the same sequence, the lag started to be noticable.

This commit changes `useDerivation()` so that it turns its derivation hot before rendering them.

Freshen derivations before render

Previously in order to avoid the zombie child problem (https://kaihao.dev/posts/stale-props-and-zombie-children-in-redux) we deferred freshening the derivations to the render phase of components. This meant that if a derivation's dependencies changed, `useDerivation()` would schedule a re-render, regardless of whether that change actually affected the derivation's value. Here is a contrived example:

```
const num = new Box(1)
const isPositiveD = prism(() => num.derivation.getValue() >= 0)

const Comp = () => {
  return <div>{useDerivation(isPositiveD)}</div>
}

num.set(2) // would cause Comp to re-render- even though 1 is still a positive number
```

We now avoid this problem by freshening the derivation (i.e. calling `der.getValue()`) inside `runQueue()`, and then only causing a re-render if the derivation's value is actually changed.

This still avoids the zombie-child problem because `runQueue` reads the derivations in-order of their position in  the mounting tree.

On the off-chance that one of them still turns out to be a zombile child, `runQueue` will defer that particular `useDerivation()` to be read inside a normal react render phase.
2022-07-12 13:34:29 +02:00
Aria Minaei
cbfc8861b5 Add comment about bundling deps in r3f/extension 2022-07-08 14:08:57 +02:00
Aria Minaei
0631d02d31 0.5.0-rc.2 2022-07-07 22:34:51 +02:00
Aria Minaei
8d977ed6ba Don't minify @theatre/r3f/dist/extension.js 2022-07-07 22:34:51 +02:00
Aria Minaei
158923b376 Upgrade playwright and percy 2022-07-07 16:36:12 +02:00
Aria Minaei
d2ef25f8d4 Quick hack to fix the randomly breaking e2e tests 2022-07-07 16:36:12 +02:00
Aria
a9910fecba
Unsuppress useful warnings in core. (#248)
This also temporarily removes `coreLogger`'s config from the public API One reason is that we don't have many logs that could benefit from suppressing (see diff) so the experimental API would not be useful to the user yet.

Also, the default config was suppressing useful warnings. Those warnings _would_ have been dead-code-eliminated in production mode anyway, so having a separate config to suppress them in dev mode makes it confusing.

Fixes P-171
2022-07-07 10:27:21 +02:00
Andrew Prifer
d1ef903355
Enable hiding the reference window (#241) 2022-06-29 15:06:24 +00:00
Andrew Prifer
2b8a1e3ed1
Fix playground live reload multiplying connections on error in Chrome and Safari (#238) 2022-06-28 22:17:37 +02:00
Andrew Prifer
a3d9892841
Relax editable TS types to allow creating editable versions of all the JSX.IntrinsicElements elements. (#237)
Enable custom editable components through relaxed typescript types
2022-06-28 16:11:28 +00:00
Andrew Prifer
b98c5d86b6
Fix editable TS (#235)
Fix primitive not being supported by the typings
2022-06-28 15:06:55 +00:00
Elliot
006121da91
Fix extension buttons spacing, add extension example (#229)
* Fix extension buttons spacing & styles
* Refactor extension button styles
* Clean up extension prism
2022-06-26 16:00:59 +00:00
Elliot
2854881e17
Add support for passing scalars to vector props (#228)
Co-authored-by: Andrew Prifer <AndrewPrifer@users.noreply.github.com>
2022-06-26 15:47:20 +00:00
Cole Lawrence
7b337a9731 doc(playground dev): Live reload README.md
Co-authored-by: Elliot <key.draw@gmail.com>
2022-06-24 09:52:56 -04:00
Cole Lawrence
df05be3c1e dev playground: Remove mention and dependency on vite 2022-06-24 09:52:56 -04:00
Cole Lawrence
2a93aa3cdc dev playground: Watch and rewrite custom index.html files 2022-06-24 09:52:56 -04:00
Cole Lawrence
aa60556046 dev: Playground "dom" offsets new boxes 2022-06-24 09:52:56 -04:00
Cole Lawrence
f70eea1c48 dev: Playground enable custom html landing page 2022-06-24 09:52:56 -04:00
Cole Lawrence
6dc68d9ae9 fix playground navigation by disabling live-reload for iframed 2022-06-22 14:58:15 -04:00
Cole Lawrence
92921734e9 docs: Remove redundant doc comment 2022-06-22 14:58:15 -04:00
Andrew Prifer
0e724d631d
Reference window fixes and improvements (#227) 2022-06-18 17:37:09 +02:00
Andrew Prifer
262d7d61d3
r3f fixes (#222)
* Minify r3f extension bundle, because it is expected by the React dead code elimination check, since we bundle React in it

* Add children to props, since it is required by React 18 types

* Fix getting context attributes for gl in ReferenceWindow

* Don't bundle threejs in extension

* Fix editor not responding to scene initialization

* Fix SnapshotEditor css
2022-06-18 00:59:45 +00:00
Cole Lawrence
16e255fd57
dev: Initial playground re-design (#218)
Improve the landing page for playground items.
2022-06-17 19:23:35 +00:00
Cole Lawrence
df692427ca dev: Build playground files much faster and add watch 2022-06-16 17:10:43 -04:00
Cole Lawrence
87070bcdf3 dev playground: Start dev server even if first build is error + remove redundant error logs 2022-06-13 11:27:36 -04:00
Cole Lawrence
4d4d970278 dev playground: Support auto port assignment + refactor 2022-06-13 09:22:14 -04:00
Cole Lawrence
8f0f76df54 rename playground build.ts 2022-06-13 09:22:14 -04:00
Andrew Prifer
162174568b
Replace Vite with ESBuild for the playground (#213) 2022-06-13 12:47:07 +00:00
Andrew Prifer
34c7b06baf
Improve dom example performance (#208)
Apply animation in dom example in a performant way
2022-06-10 15:27:33 +02:00
Aria
4215d561d0
Upgrade percy (#207) 2022-06-10 13:16:34 +02:00
Cole Lawrence
f1844952ea
Add initial tools for managing derivations and React compatibility (#202)
Co-authored-by: Cole Lawrence <cole@colelawrence.com>
Co-authored-by: Elliot <key.draw@gmail.com>
Co-authored-by: Aria <aria.minaei@gmail.com>
2022-06-09 19:12:40 +02:00
Elliot
bebf281517
Fix process.env.version in browser-bundles (#206)
* Fix `process.env.version` in browser-bundles

- also fix tsdoc warns in mjs files

Co-authored-by: Fülöp Kovács <kovacs.fulop@gmail.com>
Co-authored-by: Cole Lawrence <cole@colelawrence.com>

* Change to `process.env.THEATRE_VERSION`

Co-authored-by: Fülöp Kovács <kovacs.fulop@gmail.com>
Co-authored-by: Cole Lawrence <cole@colelawrence.com>
2022-06-09 19:05:25 +02:00
Aria Minaei
f8bb2d7ae6 0.5.0-rc.1 2022-06-01 15:51:33 +02:00
Andrew Prifer
763d37aee3
UI fixes (#187)
Co-authored-by: Aria Minaei <aria.minaei@gmail.com>
2022-06-01 14:46:37 +02:00
Aria Minaei
9d767a08ac Hotfix for the aggregate tracks not getting updated on changes
Co-authored-by: Fülöp <fulopkovacs@users.noreply.github.com>
2022-05-30 16:43:01 +02:00
Elliot
564e54c314
Single tween editor for aggregate rows (#178)
Co-authored-by: Cole Lawrence <cole@colelawrence.com>
Co-authored-by: Aria Minaei <aria.minaei@gmail.com>
2022-05-29 13:12:30 +02:00
Aria
9b4aa4b0e0
Make @theatre/r3f play well with different vs of react,three,r3f #177 2022-05-27 21:59:51 +02:00
Andrew Prifer
0690a85ae2
UI improvements/sidebar pinning (#175)
Co-authored-by: Aria Minaei <aria.minaei@gmail.com>
2022-05-25 20:42:01 +02:00
Aria
ec18687a98
Re-do bundling, compat tests, and extension API (#174) 2022-05-25 00:37:18 +02:00
Cole Lawrence
5ee9a2543f playground(dom): Add nested compound prop "favoriteFood" 2022-05-23 12:46:30 -04:00
Cole Lawrence
75a20c50ac Add "Example Namespace / *" to some objects in r3f-rocket 2022-05-20 07:46:17 -04:00
Cole Lawrence
84daaaf94a dev: Add configurable ITheatreLogger
Addresses the lack of options we currently have for surfacing issues in
our application via debugging tools. Prioritizes performance and
usability (visually) over clarity in some places that could have been
object mapped.

A logger with three separate audiences:

 * `internal`: Logs for developers maintaining Theatre.js
 * `dev`: Logs for developers using Theatre.js
 * `public`: Logs for everyone

This logger supports:
 * multiple logging levels (error, warn, debug, trace),
 * multiple audience levels (internal, dev, public),
 * multiple categories (general, todo, troubleshooting)
 * named and keyed loggers (e.g.
   `rootLogger.named("Project", project.id)`)
 * console styling with deterministic coloring
 * console devtool maintains accurate sourcemap link to logging origin
   (e.g. `coreExports.ts:71` as opposed to `logger.ts:45` or whatever)
 * swappable logger
 * customizable filtering
 * Accepts lazy `args`: `args: () => object` via
  `logger.lazy.<level>("message", () => <expensive computation>)` (e.g.
  `logger.lazy.debugDev("Loaded project state", () => ({ save: bigProject.exportToSaveable() }))`)
2022-05-19 16:34:34 -04:00
Don McCurdy
386a8fafac
theatre/r3f: Allow physical lighting in snapshot viewport (#114)
Co-authored-by: Andrew Prifer <andrew.prifer@gmail.com>
2022-05-19 12:48:59 +02:00