GitLab Digital Experience, 29 Jun 2023

Previous Meeting Next Meeting

⏯

youtube image

►

From YouTube: DEx Retro - June 29, 2023

Description

Digital Experience Handbook: https://about.gitlab.com/handbook/marketing/digital-experience/

A

Hi everyone uh welcome to a digital experience team. This is our iteration retro. Today is Thursday June 29th, we'll go over some of the things that went well and some things to improve on uh first up for things that went well is Nathan.

B

Thank you. Yes, I want to give a shout out to Megan for kind of initiating that that API call and figure it out with six cents and getting the tokens all set up, because I pretty much just copied you for buyer experience, but I am excited to start using it, and I am excited to use that confidence field at the give back, which will be pretty cool. We can probably do some logic where it's like.

B

If the confidence is I, don't know good, do something, but anyway yeah pricing Pages using it I think the nav will soon. So that's awesome, Lauren I, don't know if you want to talk as you type yeah.

C

Piggybacking on that um good job Megan for finding like an interesting thing, we had going on with our our navs loading slower and it happened to be because of um the calls are making demand base.

C

um So that's going to increase, moving to Sixth Sense, we'll fix it, but good job, diving in and figuring that one out. That is not what I expected so super cool um I have the next one, and this is over for infrastructure, just like great job helping us set up for a fastly to cloudflare migration.

C

um The review of apps have been running well and we actually solved a bug that we found yesterday and FYI that is happening, um July 5th, zero UTC. That is pretty much when the fireworks are going off for July 4th. So it's natural code lock, don't be changing anything they're, changing their CDN and I. Think everything will be fine um when we come online on July 5th, so pass it over to Laura.

A

Yeah, just a quick thanks to the team I was out and when I came back, barely any to-do's or jobs, so that was nice. Thank you. Everyone for the coverage, uh Mateo.

D

Yes, I just wanted to mention that we got through all the customer case- migrations at least the ones that have issues created and by experience. I think that's awesome. Not all of them are closed, but the ones that are not are already assigned or have a membership list. So yeah, that's pretty nice um Nathan I.

B

D

Do you have important there.

B

Oh okay, I should have wrote, doesn't I don't need to speak but uh yeah. So there's a couple on the sitemap, but I bet you it's just from ones that we haven't gone back and deleted. So I'll be curious to see if there's any left over, but yeah I don't even know how many that was like a hundred there's a lot of copy pasting, but.

E

It was like 77 or 78 .

B

That's a lot of copy pasting, but it's fun. They look a lot better and at least we can control them better in our experience. uh Laura, do you want to start on things to improve on.

A

Sure yeah also.

A

Also solves so I've noticed that in a few that I've done um so a nice cross-functional team but yeah for things to improve on um while I was gone.

A

uh Like last I heard we were using better CMS uh going forward and then we made the switch to contentful and I just wanted to know, um like maybe kind of some context around that decision, and you know, like I, think we we built out a few versions of like trying out each of these cms's, and you know where those decisions were made in in relation to trying all the different versions that we tried.

A

um I, don't know where that decision was made.

E

um So there's been communicated to some of the people. Who've been working a little bit more with this you're out. I, don't know if you're ever coming back, Laura Assad, just I wasn't gonna, like you know, mail, you directly, oh speaking of I, never.

F

E

A

We can hear you I mean if it's I know: okay,.

E

Can I change my virtual background to Laura's back.

A

Oh I see it. It's me.

E

Never used it in the entire time again um with that said so yeah we were going back and forth between better CMS and contentful um and where we ended up as they kind of were neck and neck, um and as we were going as like both feature sets really um highlighted each other and they had some different different in different uh features between the two and at the end of the day, when you really dove into like the long term like features and functionality.

F

E

We want to get a lot to use in the marketing organization.

F

E

Use contentful kind of one out from a if we're just looking at it from a pure sex.

F

E

Standpoint I think we might have gone with butter or another option, but things this is not a Dex tool. This is a marketing.

F

Organization tool we.

E

Had to look at it from that lens and from that lens on the features that.

F

E

F

E

Think that's the the decision towards the last minute really came down to reshifting our focus on the marketing organization as a whole versus how digital experience at our Engineers could build.

F

E

And that's kind of where that shift came from.

A

I appreciate it. Thank you. uh Move on who's. Next I lost my space uh TM.

G

Yeah, uh so actually I was thinking about this of like improving some components, so we can make things more reusable uh because me and Trevor.

G

We were talking about the page that we just made lives the new getting started videos, and then there was like a component a card component that uh I I knew that I saw it somewhere, but when I I had to browse our pages and then I saw some that look real similar but were not the same, but like I know that if I did some updates on the existing components, we could like pass some props and then it could. You know, look the same life changed.

G

The side of the image or like the button, could receive a text as a property.

G

um You know because the text, sometimes it's even hard-coded or the gr JGA text hard coded so I, noticed that this happens a lot actually so I don't think we need to create a new component, but maybe when we notice that a specific component could receive like an update, so we can pass some properties and make it you know be useful to a lot of pages. We could do that and yeah.

G

Like obviously also said, uh I had to browse a lot of pages to find the components because they are not flipper components, so maybe a showcase could help too I I, don't know if someone wants to talk.

F

H

Okay, next, yes, we have things about this before and I'm still thinking that having a components Library like uh like John will say next, like a storybook or maybe a dummy Catalyst page to check a what components do we have already and what we call reuse or just adapt, because there are some and also we need to start from split the implementation from the component. We don't I think it's not the best idea to put the components in the page that we are using.

H

I I believe that the best way to Department follow is the component from what is or what is its purpose. uh This can be made, make them more reusable or more generic and prevent the Redundant code.

I

Yes, uh to complete what I'll always said, uh it will be cool to have like a storybook or some like visual library that we can see what are the components that are most commonly used in body experience different from slippers, because in a slippers we have Atomic components, but in buyer experience we have more big components and I forgot. The word uh molecular components so like having I, don't know, headers or or folders, or things like that visually.

I

So when a developer goes to buy experience and needs to implement a component, they will go first to this visual component library and then see if that exists and avoid code, duplication, I know it's really hard, but if we have time and resources that would be a good idea.

G

Yeah I do agree with that.

I

I think next one is Miguel.

J

Yeah um I think it's also related to slippers um uh and there's also like a general push to improve page load, performance and general performance in this site. So I was wondering if um maybe importing specific components to which uh page could help in improving page load. For for that page, uh instead of having like all uh slippers components available for everything in the buyer, experience.

J

Yeah, it could be.

J

It's it's yeah. It's a doubt that I had from that recent change. We had uh where we now have like all slippers component available either by experience repo, so yeah.

B

Sorry I was like typing as you're talking um yeah in terms of components like I'm, trying to think I'm looking at like bootstrap and a lot of those other Design, Systems and I I. Think for a static site or server side generated site. I, don't know if there's much performance from importing all because I think either um webpack or Vite is pretty smart. I just don't know about the icons.

B

I really feel like the icons are, what's messing us up and so I'm curious to separate them into its own package so that we have like slippers, components and then slippers icons, because I think it's the icons that might be slowing things down because we're importing those icons on like every page um yeah. It is something we should look into, though I'd be curious to see.

C

But don't we need the icons on every page.

B

Yeah but I'm wondering if, if we're importing all of them, if we don't need them all, like I, don't know if we're doing that kind of tree shaking in buyer experience bring the ones we don't need, because I bet you, we only lose use like 20 of them or maybe even a bit more of it, because we're also using the ones from from product.

B

So we probably have like 500 icons.

C

What, if we put the icons in by our experience with that help or make it worse,.

B

The tricky part is, we always have the one for product which we can't really copy, so we're always going to have to import those, but I do have an issue to look into icon. I just didn't get around with this iteration, so I can do like a spike and get back to everybody at next retro.

K

There's nothing out there to improve like the icon Library, as is because I know, there's a a lot of icons that are old branding or that we have and we just have never used or um so there's something out there just to kind of look into which ones you can remove and for keeping up to date.

I

Yeah I I have I know this program is, is really bad. um I tried uh using um lazy loading in.

F

A sleeper side.

I

It's easy to uh Lazy Love all these Cycles, but in buyers period size uh importing them as a separate files. I could not find a solution um if any of of that, anyone in the team is able to do that. That would be like the big solution in order to improve the icons but I I couldn't do it. So if anyone can that would he they will be my hero.

A

Also, is there a future where um the CMS would host icons? I know we talked about maybe logos, but I don't know if icons make sense to live there.

E

They could how we use icons in like that um code, import fashion, it isn't as useful like there's got to be. There is a better way, like you know, there's a ton of fun libraries out there that are able.

F

E

Load in thousands of icons, svgs or find Icons like and more like tree shaking as needed, I think that's really um what we.

F

E

Think, where Nathan's getting at to like maybe decouple slippers and icons, there's like two separate packages, would also help too, because what we're running into.

F

E

Like the initial load for that slippers, like bundle, JS is one of the bigger things that, like the Dom loads and it's digging.

F

Us on a lot of.

E

um Page speed score so even just separating those into like two separate JS.

F

E

Would probably actually um reduce.

F

That or to load.

E

Time and increase page scores.

B

Yeah there is, um you can have separate modules in one Repository.

B

uh Have we started to start coming.

B

As long as it's done cleanly, it can be it's easy, but if it gets messy, then it's kind of complicated to maintain two different packages, because if they have different dependencies but hopefully they'll be the same.

H

H

Okay, because uh there is some other Improvement that I'm still I still want to implement at least a writing radiating enough or removing the scope class. We can use the slippers classes as a Styles, and in there are so many there are there's going to be lots of situations when I just want them the style of headers type of body, a Type 3, the balls that stuff and I can use this classes.

H

I need to import and copy still the CSS, because they scored classes so rain of moving the script Plus in slippers enable us in video experience to use a freely and prevent to duplicated code.

H

It could be helpful.

H

And about the icons, why do not Implement icons like um one awesome, like um class basic in the yes and CDN download.

B

Yeah, that might be a good idea just to move the icons too I'm curious to see if there's like a fun awesome, View library that we can see and just take a peek at what they do, because I'm sure it's open source.

H

Having the Assets in the CDN and just importing in the in the undergo with classes.

H

Instead of having in instead of having it in a in the JS package since the yes, since the models from next.

C

I I wonder if we could load slippers from the CDN that even possible.

B

It could it's just a different way to serve the assets. um Probably what I'd be more inclined to do is maybe serve styles from the CDN, but the components I would like to keep. Probably in a node. There is an npm package or module whatever you want to come on.

C

Yeah, and would that even improve our performance or just.

B

Not so much performance but I, think we've run into issues or when Miracle is doing, for example, The Styling the free trial page on the core repo. It would have been nice if he could have hit or imported like a I. Don't know slipper Styles thing CDN, so we don't need to bring in all these view, components that just an extra import to the whole product which I highly doubt they would have accepted, but they're they might include a couple style sheets. Just for a page.

H

So but will be the first step to try.

L

I have a point that I kind of put as not need to vocalize, but I could vocalize is that I have something scope next iteration we're looking at how our Lighthouse CI scores are doing, uh there's some stuff in there. That could be helpful for us to figure out like what's the problem. That's like we have a general like. We have a performance thing that we probably should fix. It might be easier to Target like a solution.

L

If we know like what problem we're trying to solve, because I feel like we could spin our Wheels like trying different things and at least like having some idea of like what we're trying to do, might make the solution more clear.

H

G

H

To experiment in this with.

H

Class, when no needed and Trace and check how it works.

B

The the biggest things that's kind of blocking us is just like we're. Gonna get a lot of output, getting rid of webpack and getting rid of um nox2 I know it's not happening soon, like just for context. I did a spike not too long ago, and next three is just not ready for us. They don't even have an i18 i18n module, their content modules barely done like there's a bunch of stuff, that's just not ready, and so we've kind of be in trouble, even their preview or doesn't work properly.

B

um But when we do go there, uh they're saying that it's like I, don't know 50 to 80, faster I'm excited to have proper, builds and also it's just a site, the size of our site like building up. If you watch the build go, if you hit your own generate and just watch like it takes a second half a second per page and we're starting to do like hundreds of pages. So it's just like just takes time. We can throw more resources at it.

D

B

But yeah kind of like have you said there or actually made me think, even by our experience like separating things like when we have the blog, you know separating maybe the blog into its own build process, so it doesn't have to bring in you know when we do by experience. We don't have to bring in the blog and so stuff, like that release posts and I'm wondering if there's even a way like when we start moving content out like a lot of the translated content will be potentially in the CMS.

B

So there's no content no assets in the repo. We should build a lot faster. Pageal times will be the same probably, but we should be able to go to review up in like five minutes.

B

A

So I stop the recording there. We have a couple of action items. Everyone is in my bedroom, yeah.

C

We're all we're all hanging out with you Laura kind of creepy, but super cool. It's.

A

A big room, yeah me and all.

F

A

A

I'm glad you guys participated wow so I'll start the recording yeah into the lore first um yeah. Thank you for watching, and we will see you next time.