Wolfram Mathematica

« first day (3507 days earlier) ← previous day next day → last day (1275 days later) »

Kuba

09:10

The Lightning Algorithm - Numberphile
https://www.youtube.com/watch?v=akZ8JJ4gGLs
With Notebook/WL implementation

Kuba

09:21

@MichaelHale I am not sure this addresses my case. Imagine you want to create a reusable component, like a slider, and publish it for others to use. So it should not require from users any fancy setup. Now, a re-render (with altering the key for example) takes a lot of time because of important reasons. An internal method .reset() will in practice do the same but faster because it knows how, what to cache, whatever. What is the proper way to allow users of the component to `reset()` instead of re-render?

This does not need to be about reset, let's say the component just shows a random image from an external source and you want to trigger getNewImage() without destroying/creating it again.

Carl Lange

09:44

@Kuba heh, one of the comments: "I was half-expecting the code to be something like PlotLightning2D[100, 100]"

Carl Lange

10:00

@Kuba I really do think using a ref is the "proper" way to do this and not particularly a hack.

Kuba

10:21

@CarlLange I don't know what people expect but if documented then yes, it is the most straightforward thing I can think of

I am just puzzled that this pattern is not discussed more widely

@CarlLange comming soon :)

4 hours later…

Michael Hale

14:04

@Kuba Well to use your specific example, there are lots of examples of reusable slider components. This is the one I use: material-ui.com/components/slider Conceptually it's like sliders in Mathematica. There is a value that is passed to the slider, and if you want to "reset" it, you just make a button to set that value back to 0 or 1/2 or whatever.

Kuba

@MichaelHale I oversimplified the example :) But I said I did, just assume you can't do what you want only by changing a prop's value.

Michael Hale

Right I'm thinking through your random image one

Kuba

This one isn't the best either because the key methods works well there. But imagine it does some initialization on the first render that you want to avoid.

Well, here is a good one, let's say we want to create a nice wrapper for a wolfram-notebook-embedder which embeds notebooks which are supposed to have a single cell with Manipulate in it.

Let's say the Manipulate controls a variable only.

So to set variable you need to do nb.setDynamicModuleVariable({cellId, name, value})

Now, it value comes as a prop then you have to create a watcher

and call this method

or you can tell users to use wrapper's setA(value) method

Maybe this is not the best either because here at some point some kind of watcher would be more appropriate because if user is calling the method the they need to decide when and the problem just shifts one level up.

Michael Hale

14:23

Right, that example I would definitely just pass the value as a prop, and in the wrapper have a useEffect(() => nb.setDynamicModuleVariable({cellId, name, value}), [value]) statement. The value in square brackets at the end means that code only runs when value changes. But for the random image thing, I think the ref to call the funciton is fine, or passing in a prop that is just a counter, or having an initialization prop that let's the child pass functions back up. All seem fine to me.

That last example is the one described here: stackoverflow.com/a/45582558/3256171

And I think for more complex scenarios, it's common for the library to provide a wrapper context component you put above both of the components we've been talking about that handles shared state and stuff. The drag and drop library I use does this.

Carl Lange

Here's a concrete example from the codebase I'm working on right now: clicking an invisible link to toggle a download.

(please avert your eyes from anything you're not supposed to see, if I left anything in there)

I need to click this link from the code, to trigger a browser download of that blob data that comes down the wire.

Michael Hale

I have pretty much the exact same snippet in my codebase lol

Carl Lange

Great minds, and all that ;)

The only difference here is that your code modifies the DOM directly, which (IIRC) is something React doesn't like you to do, due to inconsistencies between the shadow DOM and the real DOM? Mine instead puts the <a> into the React tree - thus, the need for the ref :)

Michael Hale

14:47

Sure, although the DOM is back to how it was by the time the function returns and I haven't noticed any problems. This way components that use it don't need to do anything special.

Carl Lange

@MichaelHale Oh, totally. I think it's just a question of which you find cleaner, to be honest.

Michael Hale

We're using this fancy client document viewer library that does all sorts of stuff React doesn't approve of, but it's contained in a wrapper component.

Carl Lange

@MichaelHale I'm doing something quite similar actually! In any case, I think this usage of refs shows that there can be reasons to use them, since not everything can be modeled easily with props and sometimes you do just need to reach through the hierarchy and call some function on a component. It's not often necessary, for sure :)

Michael Hale

Yes I definitely use refs from time to time. Mostly to manually adjust focus, scroll position, text selections, etc. And some libraries need refs passed in because they'll do things with them too.

But my favorite times are when I get to mix in little Mathematica influences like calling something *ExportString(...) haha. Lodash covers a good chunk of the utility functions.

Carl Lange

15:07

@MichaelHale I still can't get over the lack of a built in Flatten function!

(It does exist now actually: developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…)

Michael Hale

Yes, flatMap too

And oddly flatMap is used in some situations where I'd prefer to just use filter due to the way Typescript type inference works. But I think that is getting improved in the next release of Typescript.

Carl Lange

Not until mid-late 2019 though: caniuse.com/array-flat

Michael Hale

Yeah thankfully we officially aren't supporting IE

Carl Lange

It's kinda funny. I used JS for over a decade and I don't think I ever wanted a flatten function. Once I'd started using Mathematica though, every time I went back to JS I was looking for flatten, partition, riffle etc. Mind-changing stuff, I suppose!

Michael Hale

Haha yep

2 hours later…

fred85

17:39

Is there a directive to increase the size of ticks in Plots?

b3m2a1

17:57

@fred85 This is done in two ways: 1. you can do manual tick specification including positions and lengths 2. you can use TicksStyle to set the thickness

fred85

@b3m2a1 Thank you for the response. I was wondering if there is a directive similar to Thickness[] which increases the length of the ticks but from your answer it seems I will have to do it manually.

1 hour later…

fred85

19:33

This does exactly what I was looking for

sites.psu.edu/charlesammon/2017/06/01/…

« first day (3507 days earlier) ← previous day next day → last day (1275 days later) »

all rooms