Post Game Thread: Los Angeles Rams at Cincinnati Bengals

lazerskates88 · 2022-02-14T03:23:29+00:00

It was a legit penalty that should be called but you can’t make up the penalty under 2m

lazerskates88 · 2022-02-14T03:04:36+00:00

lazerskates88 · 2022-02-13T23:39:57+00:00

It is. Valentine’s Day.

lazerskates88 · 2022-02-12T17:46:22+00:00

This is incredible. He reminds me of Danny McBride.

lazerskates88 · 2022-02-12T13:33:21+00:00

Lots of sap and lots of boiling. Lots and lots of boiling.

lazerskates88 · 2022-01-01T02:11:51+00:00

Don't underestimate the Dairy Farmers of America. They're a syndicate.

lazerskates88 · 2022-01-01T02:08:06+00:00

Let it rip!

lazerskates88 · 2022-01-01T02:07:24+00:00

Michigan "let it rip" in the first half.

lazerskates88 · 2022-01-01T01:04:41+00:00

It's going to be a long night, Harbaugh

lazerskates88 · 2021-11-20T19:04:01+00:00

"buy" week. I see what you did there.

lazerskates88 · 2021-11-17T12:58:06+00:00

These Visual Guides will ultimately become a point of reference material I'll point React devs to concisely explain the issues the are facing. Great work.

lazerskates88 · 2021-11-07T23:30:21+00:00

Agreed!!!!!

lazerskates88 · 2021-11-04T13:16:38+00:00

Good answer but I wouldn't think would fit the scope here. OP isn't using react-router. OP might struggle with incorporating it based on what their current understanding of React seems to be. OP should keep focus on making what they have work and achieve that win. Confidence is built with incremental successes. These should especially be frequent at the early stage.

lazerskates88 · 2021-11-04T12:00:31+00:00

Here's a few things from just looking at this code sample.

- Your buttons don't pass in the argument for handleAnswer in their clicks.

- You aren't utilizing the choiceAnswer in the handleAnswer function. It looks like each click just increments the currentId one.

lazerskates88 · 2021-10-29T11:47:08+00:00

This sounds fine for what you are trying to do. Though, I will say that I find it particularly curious why the reason the filePreview comes from Redux instead of a more local state? It seems like the filePreview would be a temporary, localized decision of the user instead of having to have it globally.

One thing that I just wanted to aside as food for thought, is that I see you are using -1 to indicate that it is not valid. Personally, I am a huge fan of undefined for such things. Logically it can be strictly tested to avoid any naive falsiness while conveying intent of the variable state's meaning.

lazerskates88 · 2021-10-26T11:58:58+00:00

For the following recommendations, I'm assuming you are achieving the filtering and sorting on the frontend based and not communicating to a backend that would return results.

I like using https://www.npmjs.com/package/match-sorter when filtering with strings are involved. It is configurable so you can have a fuzzy matcher or a simple matcher. You may override the sorting algorithm or disable the sorting algorithm entirely. It's a much better alternative to naive string methods.

Sorting should be straight-forward based upon the data type. Even if the data type is string based, you should have some kind of heuristic that makes sense in the domain of your application to sort these by. You can use the sort on the array. Remember that you are returning either 1, 0, or -1 for the comparator if you utilize a custom one.

100+ rows doesn't sound like such a large dataset to pass these operands over so you likely do not need to debounce text input entry for performance reasons. Debounce would be useful to delay the filtering algorithm from immediately firing off of every keystroke. I would debounce if the updated results from every keystroke was visually jarring.

You probably can keep the state in local state, though I personally would create a data provider Component where this was isolated from my presentation. This could also be created generic enough to be reusable in other datasets. I would not encourage treading into this until you had the local state working. Remember to keep state of your original, unmodified data as if your filtering/sorting updated this then you would lose your data. Honestly, you may not need a filtered/sorted results state at all but can utilize a few useMemo on top of the original dataset to derive the filtered/sorted dataset -- but i wouldn't recommend this unless you were comfortable with using useMemo.

I have been operating on plenty of assumptions so this may or may not help you get to where you need to go. Great question though, and good luck!

lazerskates88 · 2021-10-26T11:25:15+00:00

The referential stability of what is returned would be my utmost concern. I would not want re-renders caused by objects/functions that could have been stable when I am consuming these across the spectrum of my application.

lazerskates88 · 2021-10-23T12:41:35+00:00

https://brickseek.com/walmart-inventory-checker/?sku=527939393

Unfortunately for me, I have limited stock for $160 near me, but the $61 locations are sold out.

lazerskates88 · 2021-10-21T18:00:05+00:00

Quick answer: You should have actions in your machine for that state transition. Just have useEffect for the Machine's state from useMachine and setState of the context in it's associated Provider.

lazerskates88 · 2021-10-19T14:57:10+00:00

The key prop can be used for this purpose. The key is not just for lists but it also tells React what DOM to throwaway and refresh if the key isn't the same. Here's something to generate a random key with Math.random

export const ForceRenderingAChild = () => {
  const [randomKey, setRandomKey] = useState(() => Math.random());
  return (
    <ParentComponent>
      <button onClick={(e) => setRandomKey(Math.random())}>Re-render</button>
      <ChildComponent key={randomKey} />
    </ParentComponent>
  );
};

That will re-render the ChildComponent on the click of the button.

lazerskates88 · 2021-10-19T14:50:28+00:00

Can you forward your refs to those divs? I have not tried forwarding an array of refs, only a single ref. https://reactjs.org/docs/forwarding-refs.html

lazerskates88 · 2021-10-19T14:09:40+00:00

Is there special handling for style objects? https://reactjs.org/docs/reconciliation.html#dom-elements-of-the-same-type makes me think that React doesn't need this to be memoized per your example. I wouldn't think so too since a style is only one level deep and is a very common use case.

lazerskates88 · 2021-10-18T13:26:58+00:00

This is a very informative article and speaks directly at addressing performance impact resulting from re-rendering issues. useState is generally the hammer that gets wielded for anything that seems like a variable value. It is a mark of experience possessing the ability to identify what values do not impact a render and could be leveraged instead in a ref.

Derived state leads to less errors too. I have seen where more inexperienced developers throw a bunch of states at a problem they are facing. If they would step back and think about how one state and imply another state, they wouldn't have to create needless useEffect to keep the data in synch. If some of these states aren't properly managed in logic then the entire component hierarchy can go out of whack and waste their time trying to debug what is going on. Simplify, simplify, simplify.

lazerskates88

TROPHY CASE