On 3/15/18, 8:47 PM, "Greg Dove" <[email protected]> wrote:
> Label is a single-line sequence of text. > >I think that is the statement that might be in the process of being >indirectly debated. >Is it documented as such? Really? We're going to nitpick over the completeness of our doc? There is a MultilineLabel component for a reason. I did not like adding more blades to the swiss-army knife in Spark Label. That wasn't PAYG. MX Label doc is here: https://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/mx/cont rols/Label.html It says: "The Label control displays a single line of noneditable text." Still trying to help our migrating users... -Alex > >On Fri, Mar 16, 2018 at 4:37 PM, Alex Harui <[email protected]> >wrote: > >> Because, this isn't an issue of performance. We give our users choices >> and a toolkit to replicate ANY HTML tree they want to. We are proposing >> to replace what is to me the most obvious Flex-like component name for >> injecting a span into the DOM. Label is a single-line sequence of text. >> So is Span. >> >> I'm not seeing a huge performance difference. If you think it is >> significant enough that our users should be alerted to use SizeableLabel >> or whatever we call the Div-wrapping-text version, start blogging it >>after >> you validate your test case. I noticed that the number of Spans the >>test >> appears to report are higher than the number of Divs, but that might be >>a >> false alarm. You can be a hero in the web world if you are right and >> change the advice I see elsewhere on the net to use Span for inline >> elements and Div for other things. Even the JSPerf page is using spans. >> Tell them to replace them. >> >> Meanwhile, I'm going back to try to migrate an app. Sure wish we had >>more >> people helping on that. >> >> -Alex >> >> >> We can certainly give them advice that SizedLabel is faster than Label >>if >> that's important, but the different didn't seem that significant. >> >> On 3/15/18, 6:14 PM, "[email protected] on behalf of OmPrakash >>Muppirala" >> <[email protected] on behalf of [email protected]> wrote: >> >> >If creating a div is more performant than creating a span, why insist >>on >> >using a span? How is that pay as you go? >> > >> >Thanks, >> >Om >> > >> >On Thu, Mar 15, 2018 at 5:19 PM, Alex Harui <[email protected]> >> >wrote: >> > >> >> A Flex Label, and any Flex component was a swiss-army knife of >>features >> >> and not PAYG. I have not given up on PAYG. I think it will pay off >> >>when >> >> we get to the last mile. If we don't stick to PAYG, I think we will >> >>just >> >> repeat the history of Flex and produce a fat framework that can't run >> >> everywhere. Yes, a Div would probably better mimic a Flex Label, but >> >>the >> >> Basic label is not a swiss-army knife. >> >> >> >> This article is old, but I think it says you can't put a Div in a >>Span: >> >> >> >>https://na01.safelinks.protection.outlook.com/?url= >> http%3A%2F%2Fdoctype.c >> >>om%2Fspan-contain-div-html5&data=02%7C01%7Caharui%40adobe.com >> %7C77b57b271 >> >>ef7423114c208d58ae0d810%7Cfa7b1b5a7b34438794aed2c178de >> cee1%7C0%7C0%7C6365 >> >>67620658308491&sdata=o9msOjZpbwywflSfgJDebUdMM3hgNP >> dN%2Btn%2BrcSZsV4%3D&r >> >>eserved=0 >> >> >> >> I think you can if you change the span's display to "block" but I >>think >> >> that is essentially replacing the element. >> >> >> >> Everything, including width and truncation should be opt-in, PAYG. >> >>Make a >> >> LabelWithWidth or SizeableLabel component that is a div if you want. >> >> >> >> Again, the goal is to encapsulate common patterns. I am not seeing a >> >>lot >> >> of Divs wrapping text nodes. I see lots of spans wrapping text >>nodes. >> >> Basic Label is that pattern. The Basic component set would be >> >>incomplete >> >> if there wasn't a component that could inject a Span into the DOM. >> >>Create >> >> another component that is a Div wrapping a text node, give it a >> >>different >> >> name, and let's move on. >> >> >> >> Alina used Label quite often without setting width. No need for >>those >> >> instances to be a Div, AFAICT. >> >> >> >> Do we even need to discuss span vs div if the truncation bead will >>work >> >>by >> >> setting display:block? >> >> >> >> We have a huge opportunity here to get another app migrated and >>prove to >> >> the world that Royale is the right choice. But we keep discussing >>stuff >> >> that IMO, isn't really moving the big pieces forward. But, IMO, we >> >>should >> >> not compromise on PAYG philosophy and patterns. >> >> >> >> My 2 cents, >> >> -Alex >> >> >> >> On 3/15/18, 4:27 PM, "[email protected] on behalf of OmPrakash >> >>Muppirala" >> >> <[email protected] on behalf of [email protected]> wrote: >> >> >> >> >FWIW, it seems like creating divs is faster than creating spans. >> >> >https://na01.safelinks.protection.outlook.com/?url= >> >> https%3A%2F%2Fjsperf.co >> >> >m%2Fspan-vs-div-creation&data=02%7C01%7Caharui%40adobe.com >> >> %7C3664f690b3da4 >> >> >e4aefab08d58acc7bf0%7Cfa7b1b5a7b34438794aed2c178de >> >> cee1%7C0%7C0%7C636567533 >> >> >215453966&sdata=oPPp2e9aRbQ%2FngKbcFMHMCmXi%2BKa%2B% >> >> 2F0aA98XFFqxhFA%3D&res >> >> >erved=0 >> >> > >> >> >Thanks, >> >> >Om >> >> > >> >> >On Thu, Mar 15, 2018 at 3:38 PM, Greg Dove <[email protected]> >> wrote: >> >> > >> >> >> Observing from the sidelines, fwiw I agree with Harbs here. Span >>to >> >>me >> >> >> makes more sense as part of the text value of a label and not as >>the >> >> >>basis >> >> >> for the representation of the Label itself - div seems closer to >> >>what I >> >> >>was >> >> >> used to with legacy Flex (which may no longer be the 'reference' >>for >> >> >> choosing an implementation). >> >> >> I don't think there is any semantic or other reason that makes >>span >> >>the >> >> >> logical default tag for Label, in fact I recall that being a >>problem >> >> >>many >> >> >> times with some work I was involved with last year using FlexJS. >> >> >> But maybe I am missing something in terms of understanding. >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> On Fri, Mar 16, 2018 at 11:08 AM, Harbs <[email protected]> >> >>wrote: >> >> >> >> >> >> > I’m suggesting to change it because span does not fit the use >>case >> >>of >> >> >> > Label. Width and truncate are just two applications which >>indicate >> >> >>that >> >> >> > span is not the correct element. I’m pretty sure I had other >>edge >> >> >>cases >> >> >> > which were likely effected by the fact that Label is a span, >> >>although >> >> >>I’m >> >> >> > not positive. >> >> >> > >> >> >> > I disagree with your distinction between span and div. >> >> >> > >> >> >> > Both span and div can have children. Spans can contain divs and >> >>divs >> >> >>can >> >> >> > contain spans. At its core, Span has nothing to do with text. >>It’s >> >> >>just >> >> >> > often used for text because text (within its container) is >>inline. >> >> >> > >> >> >> > MDN says[1] "<span> is very much like a <div> element, but <div> >> >>is a >> >> >> > block-level element whereas a <span> is an inline element.” >> >> >> > >> >> >> > Label is *not* necessarily an inline element. We have all kinds >>of >> >> >> layouts >> >> >> > for Label. Many (most?) of them are not inline. >> >> >> > >> >> >> > If you feel really strongly about this, I’ll revert even though >>I >> >> >> disagree. >> >> >> > >> >> >> > FWIW, the truncate bead does not need to change the element >>type. >> >>It >> >> >>can >> >> >> > explicitly set the display of the element to block. >> >> >> > >> >> >> > Harbs >> >> >> > >> >> >> > >> >> >>[1]https://na01.safelinks.protection.outlook.com/?url= >> >> https%3A%2F%2Fdevel >> >> >>oper.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FHTML%2FElement% >> >> 2Fspan&data=02%7C0 >> >> >>1%7Caharui%40adobe.com%7C3664f690b3da4e4aefab08d58acc >> >> 7bf0%7Cfa7b1b5a7b344 >> >> >>38794aed2c178decee1%7C0%7C0%7C636567533215453966&sdata= >> >> xrtF9H7%2BjFzqGDax >> >> >>nj0%2BuY3hsHu6BaUb4Yp15ucwhyc%3D&reserved=0 < >> >> >> > >> >> >>https://na01.safelinks.protection.outlook.com/?url= >> >> https%3A%2F%2Fdevelope >> >> >>r.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FHTML%2FElement% >> >> 2Fspan&data=02%7C01%7 >> >> >>Caharui%40adobe.com%7C3664f690b3da4e4aefab08d58acc >> >> 7bf0%7Cfa7b1b5a7b344387 >> >> >>94aed2c178decee1%7C0%7C0%7C636567533215453966&sdata= >> >> xrtF9H7%2BjFzqGDaxnj0 >> >> >>%2BuY3hsHu6BaUb4Yp15ucwhyc%3D&reserved=0> >> >> >> > >> >> >> > > On Mar 15, 2018, at 11:25 PM, Alex Harui >> >><[email protected]> >> >> >> > wrote: >> >> >> > > >> >> >> > > Label in Flex and Royale is not intended to have any children >> >>(other >> >> >> than >> >> >> > > bold, italic and other text markup). Span represents that. >>Div >> >> >>does >> >> >> > not. >> >> >> > > You are suggesting changing to div JUST IN CASE someone needs >>to >> >> >>set a >> >> >> > > width and/or truncate. Just-in-case code is not PAYG. >> >> >> > > >> >> >> > > My 2 cents, >> >> >> > > -Alex >> >> >> > > >> >> >> > > On 3/15/18, 2:17 PM, "[email protected] <mailto: >> >> >> > [email protected]> on behalf of Carlos Rovira" >> >> >> > > <[email protected] <mailto:[email protected]> on >> >>behalf >> >> >>of >> >> >> > [email protected] <mailto:[email protected]>> wrote: >> >> >> > > >> >> >> > >> And why not change IBeadView in Label for a view that uses a >>div >> >> >>when >> >> >> > >> needed? ;) >> >> >> > >> in the other cases, maintains the span >> >> >> > >> >> >> >> > >> 2018-03-15 21:05 GMT+01:00 Harbs <[email protected]>: >> >> >> > >> >> >> >> > >>> I’m still not understanding you. What about Label says it’s >>a >> >>span >> >> >> > >>> instead >> >> >> > >>> of a div? Why is making it a div not PAYG? Span simply >>limits >> >> >>Label >> >> >> > >>> unnecessarily. I think span is not the appropriate element >>for >> >> >>Label. >> >> >> > >>> >> >> >> > >>>> A Label without width should grow to the size of its text. >> >>Isn't >> >> >> that >> >> >> > >>> how >> >> >> > >>>> it worked in Flex? >> >> >> > >>> >> >> >> > >>> Sure, and a div does that too. In Flex, a label could have a >> >>width >> >> >> too >> >> >> > >>> if >> >> >> > >>> specified. Spans cannot. >> >> >> > >>> >> >> >> > >>> Harbs >> >> >> > >>> >> >> >> > >>>> On Mar 15, 2018, at 9:56 PM, Alex Harui >> >> >><[email protected]> >> >> >> > >>> wrote: >> >> >> > >>>> >> >> >> > >>>> Have the truncation bead swap the span for div. Again, >>some >> >> >> component >> >> >> > >>> has >> >> >> > >>>> to put a span in the DOM. Label has been just fine for >>that >> >>so >> >> >>far. >> >> >> > >>>> >> >> >> > >>>> A Label without width should grow to the size of its text. >> >>Isn't >> >> >> that >> >> >> > >>> how >> >> >> > >>>> it worked in Flex? >> >> >> > >>>> >> >> >> > >>>> Maybe Label should be refactored to not have width/height >> >> >>properties >> >> >> > >>> but >> >> >> > >>>> IMO we have bigger fish to fry. >> >> >> > >>>> >> >> >> > >>>> I'm sure Div is used to wrap text in some frameworks, but >> >>those >> >> >> > >>> frameworks >> >> >> > >>>> probably aren't PAYG. In Alina's app, Label has a usage >> >>score of >> >> >> 69, >> >> >> > >>> but >> >> >> > >>>> Label.width has a score of only 5. We will have her use >> >> >> > >>>> LabelWithTruncation or add the truncation bead on the few >> >>labels >> >> >> that >> >> >> > >>> need >> >> >> > >>>> >> >> >> > >>>> My 2 cents, >> >> >> > >>>> -Alex >> >> >> > >>>> >> >> >> > >>>> On 3/15/18, 12:45 PM, "Harbs" <[email protected]> >>wrote: >> >> >> > >>>> >> >> >> > >>>>> But we already have a truncation bead. The only reason it >> >> >>doesn’t >> >> >> > >>> work >> >> >> > >>> in >> >> >> > >>>>> Label is because spans don’t have widths. >> >> >> > >>>>> >> >> >> > >>>>> Label is not something which should flow beyond its >>bounds — >> >> >>which >> >> >> is >> >> >> > >>>>> what span is useful for. I still don’t see why you think >>span >> >> >>makes >> >> >> > >>> more >> >> >> > >>>>> sense. >> >> >> > >>>>> >> >> >> > >>>>> FWIW, div *is* used as a container for text in various >> >> >>frameworks. >> >> >> > >>>>> >> >> >> > >>>>> My $0.02, >> >> >> > >>>>> Harbs >> >> >> > >>>>> >> >> >> > >>>>>> On Mar 15, 2018, at 9:42 PM, Alex Harui >> >> >><[email protected] >> >> >> > >> >> >> > >>>>>> wrote: >> >> >> > >>>>>> >> >> >> > >>>>>> AIUI, "inline" is the default display style for Span. >> >>"block" >> >> >>is >> >> >> > >>> the >> >> >> > >>>>>> default for Div. HTML flows inline by default for just >> >>plain >> >> >> text. >> >> >> > >>>>>> Basic >> >> >> > >>>>>> components try to give Flex-friendly names for >>HTMLElements. >> >> >>Some >> >> >> > >>>>>> component in Basic needs to inject a span into the DOM. >>In >> >>a >> >> >>few >> >> >> > >>>>>> seconds >> >> >> > >>>>>> of looking at a Google web page, I did not see any divs >>with >> >> >>text >> >> >> as >> >> >> > >>>>>> children. I saw spans. The Divs all contained other >> >>elements. >> >> >> > >>>>>> >> >> >> > >>>>>> I don't create HTML web pages for a living, but if I >>were to >> >> >> place a >> >> >> > >>>>>> label >> >> >> > >>>>>> over a control like I often see in Flex, I would not wrap >> >>the >> >> >> label >> >> >> > >>> in >> >> >> > >>> a >> >> >> > >>>>>> Div. The control would be div, so I would us a span or >>just >> >> >>plain >> >> >> > >>> text. >> >> >> > >>>>>> If I looked at the final DOM and saw Divs around every >> >>chunk of >> >> >> > >>> text, I >> >> >> > >>>>>> would think there is something heavy about the framework. >> >> >> > >>>>>> >> >> >> > >>>>>> Again, the goal is to encapsulate common patterns. Label >> >> >>combined >> >> >> > >>> with >> >> >> > >>>>>> some control is trying to replicate common patterns for >> >> >>labeling >> >> >> > >>>>>> controls. >> >> >> > >>>>>> You are trying to solve the common pattern of truncating >> >>text. >> >> >> That >> >> >> > >>>>>> will >> >> >> > >>>>>> require a Div. But truncation, or even width/height is >>not >> >> >> something >> >> >> > >>>>>> that >> >> >> > >>>>>> should be built into Label for PAYG reasons. IMO, you >> >>should >> >> >> > >>> create a >> >> >> > >>>>>> different component with a different name. >> >>TruncatingLabel, or >> >> >> > >>>>>> LabelWIthTruncation. >> >> >> > >>>>>> >> >> >> > >>>>>> My 2 cents, >> >> >> > >>>>>> -Alex >> >> >> > >>>>>> >> >> >> > >>>>>> On 3/15/18, 12:19 PM, "Harbs" <[email protected]> >> wrote: >> >> >> > >>>>>> >> >> >> > >>>>>>> Why is span lighter than div? >> >> >> > >>>>>>> >> >> >> > >>>>>>> Inline and nowrap is not specific to span. AFAICT, >>there’s >> >> >> nothing >> >> >> > >>>>>>> specific to snap which fits Label better than div. >> >> >> > >>>>>>> >> >> >> > >>>>>>> As far as components which “does” span: Besides Span in >> >>HTML, >> >> >>we >> >> >> > >>> have >> >> >> > >>>>>>> HTMLText in Basic which encapsulates span. >> >> >> > >>>>>>> >> >> >> > >>>>>>> I can revert the change I made to Label, but I have not >> >>seen >> >> >>any >> >> >> > >>>>>>> downside >> >> >> > >>>>>>> to using div for Label. It seems to me that there’s >> >>nothing in >> >> >> the >> >> >> > >>>>>>> Label >> >> >> > >>>>>>> promise which dictates using span. >> >> >> > >>>>>>> >> >> >> > >>>>>>> Harbs >> >> >> > >>>>>>> >> >> >> > >>>>>>>> On Mar 15, 2018, at 6:55 PM, Alex Harui >> >> >> <[email protected] >> >> >> > > >> >> >> > >>>>>>>> wrote: >> >> >> > >>>>>>>> >> >> >> > >>>>>>>> >> >> >> > >>>>>>>> >> >> >> > >>>>>>>> On 3/15/18, 5:34 AM, "Harbs" <[email protected]> >> >>wrote: >> >> >> > >>>>>>>> >> >> >> > >>>>>>>>> Gotcha. FWIW, we now have the HTML element component >>set >> >> >>which >> >> >> > >>> more >> >> >> > >>>>>>>>> thinly wraps HTML elements. >> >> >> > >>>>>>>>> >> >> >> > >>>>>>>>> I can’t think of any reason why Label would be better >>as >> >>a >> >> >>span >> >> >> > >>> than >> >> >> > >>>>>>>>> a >> >> >> > >>>>>>>>> div. It seems to me that simply using div instead of >>span >> >> >>would >> >> >> > >>> make >> >> >> > >>>>>>>>> Label more versatile. Am I missing something? >> >> >> > >>>>>>>> >> >> >> > >>>>>>>> You may be missing that the only real goal of Royale >>is to >> >> >> > >>> encapsulate >> >> >> > >>>>>>>> popular patterns. Pretty sure I've seen span used on >>many >> >> >>web >> >> >> > >>> pages, >> >> >> > >>>>>>>> so >> >> >> > >>>>>>>> we need a component that does what it does, including >> >> >>assuming >> >> >> > >>> inline >> >> >> > >>>>>>>> instead of block display. Similarly, what would you >>think >> >> >>of a >> >> >> > >>>>>>>> framework >> >> >> > >>>>>>>> that had a HelloWorld that used a div instead of a >>span? >> >>You >> >> >> > >>> might >> >> >> > >>>>>>>> think >> >> >> > >>>>>>>> it is too heavy. >> >> >> > >>>>>>>> >> >> >> > >>>>>>>> Per PAYG, if span doesn’t' support certain features, >>then >> >>you >> >> >> > >>> create >> >> >> > >>> a >> >> >> > >>>>>>>> LabelWithTruncation and have it use a Div if you need >>to. >> >> >> > >>>>>>>> >> >> >> > >>>>>>>> My 2 cents, >> >> >> > >>>>>>>> -Alex >> >> >> > >>>>>>>>> >> >> >> > >>>>>>>>>> On Mar 15, 2018, at 2:30 PM, Peter Ent >> >> >><[email protected] >> >> >> > >> >> >> > >>>>>>>>>> wrote: >> >> >> > >>>>>>>>>> >> >> >> > >>>>>>>>>> Label was one of the very first components and the >>idea >> >>was >> >> >> > >>>>>>>>>> minimalism. >> >> >> > >>>>>>>>>> Button was <button> and TextInput was <input >> >>type="text"> >> >> >>and >> >> >> > >>> Label >> >> >> > >>>>>>>>>> was >> >> >> > >>>>>>>>>> <span>. >> >> >> > >>>>>>>>>> >> >> >> > >>>>>>>>>> I'm wondering if we should have NativeButton, >> >>NativeLabel, >> >> >> etc. >> >> >> > >>>>>>>>>> which >> >> >> > >>>>>>>>>> would be these minimal elements and have others that >>are >> >> >><div> >> >> >> > >>>>>>>>>> wrapping. >> >> >> > >>>>>>>>>> For instance, ImageAndTextButton is a <button><img >> >> >> > >>>>>>>>>> src="goo.jpg">Label >> >> >> > >>>>>>>>>> Here</button> which works but the alignment is weird >>so >> >> >>maybe >> >> >> > >>>>>>>>>> ImageAndTextButton should be a <div><img>Text</div> >> >>which >> >> >>can >> >> >> be >> >> >> > >>>>>>>>>> aligned >> >> >> > >>>>>>>>>> and styled better. >> >> >> > >>>>>>>>>> >> >> >> > >>>>>>>>>> Anyway, that's the reason: simplicity. >> >> >> > >>>>>>>>>> >> >> >> > >>>>>>>>>> ‹peter >> >> >> > >>>>>>>>>> >> >> >> > >>>>>>>>>> On 3/15/18, 7:51 AM, "Harbs" <[email protected]> >> >> wrote: >> >> >> > >>>>>>>>>> >> >> >> > >>>>>>>>>>> Is there a reason that the element type of Basic >>Label >> >>is >> >> >> span? >> >> >> > >>>>>>>>>>> >> >> >> > >>>>>>>>>>> I tried adding a łTextOverflow˛ bead to a Label and >>it >> >> >>does >> >> >> not >> >> >> > >>>>>>>>>>> seem >> >> >> > >>>>>>>>>>> to >> >> >> > >>>>>>>>>>> work because spans donąt really have a working >>width. >> >> >> Switching >> >> >> > >>> the >> >> >> > >>>>>>>>>>> element type to div seems to make it work. >> >> >> > >>>>>>>>>>> >> >> >> > >>>>>>>>>>> Harbs >> >> >> > >>>>>>>>>> >> >> >> > >>>>>>>>> >> >> >> > >>>>>>>> >> >> >> > >>>>>>> >> >> >> > >>>>>> >> >> >> > >>>>> >> >> >> > >>>> >> >> >> > >>> >> >> >> > >>> >> >> >> > >> >> >> >> > >> >> >> >> > >> -- >> >> >> > >> Carlos Rovira >> >> >> > >> https://na01.safelinks.protection.outlook.com/?url= >> >> >> > http%3A%2F%2Fabout.me%2 >> >> >><https://na01.safelinks.protection.outlook.com/?url= >> >> https%3A%2F%2Fna01.sa >> >> >> >>>>felinks&data=02%7C01%7Caharui%40adobe.com% >> 7C3664f690b3da4e4aefab08d58ac >> >>>>c >> >> 7 >> >> >>bf0%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0% >> >> 7C636567533215453966&sdata >> >> >>=exoH%2BPKzuyM%2BykE65GQeHk%2BjPAZSsUFjsKwx3BRvjsk%3D&reserved=0. >> >> >> > protection.outlook.com/?url=http%3A%2F%2Fabout.me%2> >> >> >> > >> Fcarlosrovira&data=02%7C01%7Caharui%40adobe.com >> >> >> >>>><https://na01.safelinks.protection.outlook.com/?url= >> http%3A%2F%2F40adob >> >>>>e >> >> . >> >> >> >>>>com%2F&data=02%7C01%7Caharui%40adobe.com% >> 7C3664f690b3da4e4aefab08d58acc >> >> 7b >> >> >>f0%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0% >> >> 7C636567533215453966&sdata= >> >> >>ewhtNMkSjHssIseUSvxq9etF%2FtrcA%2Buqk3sZlJkjHuc%3D&reserved=0 >> >> >> >% >> >> >> > 7Cae539925833d453aaa2e08d5 >> >> >> > >> 8aba29c4%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0% >> >> >> > 7C636567454874235113&s >> >> >> > >> data=Xvu%2BZ7186rOBNg5j0KrJsGPi5O4YnwiY >> 1WVtz2xsNvc%3D&reserved=0 >> >> >> > >> >> >> > >> >> >> >> >> >> >> >> >>
