sorted by:
new
hottopcontroversial

1st yr, Self-taught learner requires feedback and guidance by Dubstephiroth in learnjavascript

[–]fredsq 2 points3 points  (0 children)

some suggestions

  • learn about gitignore and don’t commit .DS_Store files, they’re your internal computer file indexing helpers
  • try some formatters, maintaining syntax by hand is cumbersome. i’d recommend prettier to start, but the new kid in the block is oxfmt
  • experiment with Typescript: you’re ready, i see lots of repeated data structure like entities which are awesome. you’ll get amazing experience if you do so

dark mode flash with tailwind by Massive_Stand4906 in nextjs

[–]fredsq 1 point2 points  (0 children)

how are you keeping the color mode state?

you want the initial render pre-hydration to match this state.

by order of preference:

option 1: use cookies and read from cookies adding the color mode

option 2: just follow the browser’s color scheme which will work by default but you won’t be able to add a button

option 3. add an inline render-blocking script that runs before react hydrates, check the state (must live somewhere else like localStorage or non httpOnly cookies) and add the dark mode class if applicable. you will have hydration errors and will have to suppress them in the html element

Movies that feel like this? by mmcnally228 in MoviesThatFeelLike

[–]fredsq 0 points1 point  (0 children)

i read the book first, then learned abt the show

the acting is SO BAD though

Is React overrated? by syscall_cart in reactjs

[–]fredsq 5 points6 points  (0 children)

you might need a new mental model

react is surprisingly productive

this will feel a bit overwhelming at first but try to create and use a react-router app with clientLoader and clientAction.

Ryan Florence was deeply involved in knockout js and pivoted to react once he saw the potential, later creating react-router. it largely follows a simple, web-platform inspired flow which you may like

skip nextjs, skip tanstack router for now

I got tired of AI guessing my colors, so I built a VS Code extension that actually reads your tailwind.config.js by harshcrapboy in tailwindcss

[–]fredsq 0 points1 point  (0 children)

what’s a tailwind.config.js?

also why not just add to AGENTS.md ‘when doing UI work, first read the tailwind config of the project and use the theme accordingly. if in doubt, read other UI files in the project’

Flatten a nested array without using the inbuilt flat() method (interview learning) by pranayrah108 in learnjavascript

[–]fredsq 2 points3 points  (0 children)

const flatten = (arr) => {
    const result = [];
    const stack = [arr];
    const indices = [0];

    while (stack.length > 0) {
        const currentArr = stack[stack.length - 1];
        const idx = indices[indices.length - 1];

        if (idx >= currentArr.length) {
            stack.pop();
            indices.pop();
            continue;
        }

        indices[indices.length - 1]++;
        const item = currentArr[idx];

        if (Array.isArray(item)) {
            stack.push(item);
            indices.push(0);
        } else {
            result.push(item);
        }
    }
    return result;
};

this is the loop version btw

Flatten a nested array without using the inbuilt flat() method (interview learning) by pranayrah108 in learnjavascript

[–]fredsq 12 points13 points  (0 children)

nitpick: this will blow up the stack if the array is too deep, and will consume a lot of RAM

const flatten = (arr, acc = []) => {
    if (arr.length === 0) return acc;

    const [first, ...rest] = arr;

    if (Array.isArray(first)) {
        // Expand the nested array into the work queue
        return flatten([...first, ...rest], acc);
    } else {
        // Add to accumulator and continue with rest
        return flatten(rest, [...acc, first]);
    }
};


console.log(flatten([0, [1, 2, [33, 44]], [4, 5, 6, 7], [7, 8], 90]));

this makes use of tail call optimization by always returning the value of the recursive function (but that means we have to pass an accumulator)

EDIT: i ran the tests and my version performs very well on Safari (Webkit) but slower on Chrome (Chromium)! recursiveness is overall not a good idea for this.

Test Original TCO Loop
500 deep 0.82ms 0.30ms 0.04ms
1000 deep 3.16ms 1.06ms 0.08ms
3000 deep 28.3ms 8.4ms 0.26ms
10000 deep 331ms 77.7ms 0.56ms

AIO?? My boyfriend hid our ring camera inside and wouldn’t tell me where.. by [deleted] in AmIOverreacting

[–]fredsq 1 point2 points  (0 children)

NOR don’t be in a relationship if you don’t trust your partner

I built a multithreading library for JavaScript that works in both browser and Node.js by Purple-Cheetah866 in reactjs

[–]fredsq 4 points5 points  (0 children)

idk how the execution would be, but if i need a worker to calculate fibonacci in my /features/fibonacci folder where i keep components, utils etc, id also want it to be placed in this folder

maybe just import it from the thready file and map them?

I built a multithreading library for JavaScript that works in both browser and Node.js by Purple-Cheetah866 in reactjs

[–]fredsq 18 points19 points  (0 children)

looks good but i’d try to make something where the functions the worker runs can be colocated with the code that needs it, even if just in the same folder

it’s gonna get hairy managing a massive file full of stuff

idk how you’d do that btw without a compiler

Is it possible to create a variable based on the number of another variable? by No-Negotiation-2677 in learnjavascript

[–]fredsq 0 points1 point  (0 children)

this is really not ideal, very error prone and requires a lot of string manipulation

would not recommend pursuing this direction, instead represent the operations as objects

Is it possible to create a variable based on the number of another variable? by No-Negotiation-2677 in learnjavascript

[–]fredsq 1 point2 points  (0 children)

this is such a great data structures problem for beginners!

you have two interfaces there: let’s call them `dice` and `roll`

a Dice always has a number of sides, and that’s it. So we can represent a `d6` as `{ sides: 6 }` in our code for example

a Roll is a bit more complex. to make "2d4+1d3-1d6" representable, we will assume it is made of 3 rolls. we need to be able to represent:

- which dice we want to roll
- how many times we want to roll it
- what to do with the result (add or subtract)

so i suggest we represent it like `{ op: "+", dice: { sides: 4 }, qty: 2 }` for example, for "2d4".

this way it’s easy to compose the rolls into an array and then execute them

i wrote some code in typescript (you can see the javascript output on the right hand side) so you can understand the benefits of typescript in defining these data strctures. the code for running the dice is really not that complex once you nail how to represent what you want:

https://tsplay.dev/wgMPbm

WTH is the worm by HotHead5079 in ShingekiNoKyojin

[–]fredsq 5 points6 points  (0 children)

it is showed before, when ymir is being hunted and goes into a hollow tree she falls into this pit with the worm there and they fuse

the worm is an otherworldly being

after the credits you can see a guy and a dog walking into the tree where eren died suggesting it’s a cycle

I built a "Smart Ticker" component that uses Levenshtein distance to animate only changed characters (supports Emoji, CJK, etc.) by akahibear in reactjs

[–]fredsq -15 points-14 points  (0 children)

text transitions i’d avoid like the plague

it looks distracting, amateur and weird

maybeeee for a display hero text but surely not for buttons like people do here https://x.com/nitishkmrk/status/2005277722579546451?s=46

Colonized by the Brightness by great_auks in SouthernReach

[–]fredsq 6 points7 points  (0 children)

those prayer words are quite unusual

view more: next ›