search

18F / jekyll_pages_api_search

DEPRECATED - Jekyll search plugin based on lunr.js and jekyll_pages_api
https://rubygems.org/gems/jekyll_pages_api_search
Other
39 stars 8 forks source link

Load minified js #2

Closed mbland closed 9 years ago

mbland commented 9 years ago

Still needs tests and polish, but got this working for both the Hub and 18f.gsa.gov.

cc: @afeld @gboone

mbland commented 9 years ago

The plugin is working really well now, given the changes from #1 and the updates in 18F/jekyll_pages_api#24. This currently contains all the commits from #1, but I'll rebase once it goes in.

mbland commented 9 years ago

cc: @adelevie, since Aidan's mostly out this week.

Alan, notice that I'll rebase this after #1 goes in first.

mbland commented 9 years ago

@jmcarp This is the PR I mentioned in today's 18F Testing Grouplet meeting. assets/js/search-main.js is the entry point for our use of RequireJS. The build.js file, which references assets/js/search-main.js, is used by the r.js optimizer to build the unified, minified bundle assets/js/search-main.min.js.

The Rakefile contains the steps to parse build.js and assets/js/search-main.js to detect when assets/js/search-main.min.js needs to be rebuilt and gzipped. It also contains tasks to check for Node.js, Bower, bower-installer, Uglifier2 and RequireJS, and to update the JavaScript components listed in bower.json. These Rakefile bits are what I'm currently trying to extract into a new gem, which I'm thinking of calling 18f_js_rake_tasks, for use in 18F/hub, 18F/18f.gsa.gov, and other projects that may want to use jekyll_pages_api_search but build their own RequireJS bundle including the search code and all the other application code. I think r.js can optimize CSS as well, but haven't tried it yet. Perhaps this gem could be extended to run Yeoman tasks to generate 18F-standard JavaScript testing frameworks/harnesses.

cc: @shawnbot @monfresh

mbland commented 9 years ago

OK, so I merged, not rebased.

afeld commented 9 years ago

My overall feeling with this PR is that I totally get where you're coming from, though this seems like a lot of moving parts for sites with a relatively small amount of client-side logic. Would love some other opinions.

The build.js file, which references assets/js/search-main.js, is used by the r.js optimizer to build the unified, minified bundle assets/js/search-main.min.js.

I used RequireJS because it's handles all the dependency loading asynchronously, without needing a build. If we are going to combine the files anyway, wonder if it's worth looking into Browserify.

Trying to decide how to manage frontend dependencies gives me anxiety attacks :grimacing: :zap:

mbland commented 9 years ago

OK, pushed an update. I share your anxiety. :-) However, as I mentioned before, I'd like to encapsulate what we have now, and perhaps continue to explore how to mange the asset bundling. FWIW, I think I like the RequireJS model, though I'm going to look up Browserify right now. Thoughts?

mbland commented 9 years ago

OK, @afeld, you done gone and made me grok Browserify and whatnot. It actually works.

afeld commented 9 years ago

Would love some other opinions.

@jeremiak? No pressure :wink: Can give you more context in person on Monday if you like. Yay for getting pulled into pull requests before your first day!

you done gone and made me grok Browserify and whatnot

Oops :grin: You didn't have anything else to do with your Friday, right?

mbland commented 9 years ago

Heh, I had nothing else to do with my Friday after I got the notion to dig into Browserify.

I've also started talking to @meiqimichelle and @msecret about using the Hub and its related parts to try out potential 18F-standard frontend conventions as part of the Frontend Guild's activities.

I will say I dig the Bower + Browserify combination. Though Node packages exist for jQuery, Angular, and lunr.js, and hence could be included in the package.json dependencies, I like that Bower allows you to grab the latest versions without waiting for someone to build an npm. That said, I'm open to adopting the alternate convention of "use an npm when possible", if that's the consensus.

Still, we need Bower for angular-livesearch. But if @msecret pushes us to get rid of Angular, perhaps we could cut out the need for Bower entirely. Browserify's debowerify transform eliminated the need for bower-installer.

I can't believe that I could credibly list "JavaScript/Frontend experience" on a government résumé now, whereas I couldn't a week or two ago. Not sure how I feel about that.

jeremiak commented 9 years ago

Ha, whoops like I missed out on this one since its merged. @afeld more context would be greatly appreciated tomorrow :)

Btw, very excited to work with yall :tada: