I'm using ACF to set a series of slots in my page. So the admin screen contains a series of Flexible fields, each of which can be one of the following:
Post
Category
Tag
Works great on the front end. I can drag-and-drop, choose posts/categories/tags etc. from the database and generally have a good time.
Unfortunately when trying to add a new slot to the page on the back end, or load it, the time taken to add a new row is killing it. I've only got a few rows there, but it's already taking unacceptably long; I'm fairly sure when I add a few more we'll start getting timeouts.
The only information I can find about this problem is this support thread on the ACF forums (https://support.advancedcustomfields.com/forums/topic/slow-backend-v-2-5-7/), which basically says:
Yeah, if you've got a big database and try and use flexible fields it's gonna do that.
I'm also using ACF-JSON to no noticeable effect.
Has anyone else experienced this problem? What did you do to work around it? Or did you have to abandon?
(Ideally my solution would keep flexible fields, as they're exactly what the client wants in this situation - but if there's another solution that enables them to edit the back end in linear time, I'm interested in that too.)
It's due to the way ACF loads its repeater fields and flexible fields. All layouts in flexible fields are loaded into the dom and hidden, and an absolute ton of javascript logic is applied to all of them. When you click to add a new "slot", it runs a clone of the hidden layout, and attaches all the necessary event handlers to the clone.
If you check the timeline for page DOMContentLoaded vs load (final render event), DOMContentLoaded is actually pretty fast most of the time, but load (everything that happens after the html is loaded) is what eats up most of that time, and memory.
Best I've been able to do is activate the new "Delay Initialization" option for WYSIWYG content fields, and disable "Stylized UI" and "AJAX" options for select, checkbox, and radio fields.
Ultimately, the biggest issues come from having deeply nested repeaters/flexfields inside repeaters/flexifields. Avoid nesting those as much as you can and page load time will decrease significantly.
If you are using any extensions that need access to the fields on any page, for example LastPass. Disabling that extension will speed up the page alot.
Related
I want to add functionality to a website I am building for a client that allows him to log on to a secure page and add new job listings. He will be the only one modifying this so I don't need to worry about concurrent access or anything like that. At this point I don't even have a database set up for him but I understand that might need to be implemented soon, for other features if not this one.
He doesn't have any knowledge of HTML so I can't just create a template job posting and have him manually fill in the information (although that is also unprofessional, I suppose.) I was planning on just making a simple php/html page where he could put the title of the job along with all details through submission of a form. Once I have that, though, I don't know how to deal with adding that job title to a list of current job postings and also have that link to a new page with all the details of the job.
My memory from early undergraduate classes are hinting that the adding jobs to a list would be object-oriented. However, I can also see something where I would just add the title to an array which the list then dynamically filled from.
Another recommendation I have received is to look into implementing a django/python solution. The problem is I have about a week to work on this and I ahve no python experience. If that is something that would be possible to learn and implement in that time, I will go for it. I just don't want to waste time on something that takes a week or two to learn and then still have nothing implemented.
Basically, I would appreciate a point in the right direction and some reassurance that I am considering all possibilities. If it would be easier to implement some kind of simple wiki, that is another option as well.
Do any of these ideas sound like the right choice? Is there anything I am missing?
I apologize if this is a trivial question but I have stumped myself and would appreciate any help you can offer.
A possible and easy solution would be using an appropriate CMS module, like Job Manager or Resume Submissions and Job Posting for WordPress. I haven't tested them personally, but they should handle everything for you through a Web interface, no coding needed (you should just adapt the WordPress CSS to match the existing client's Website style).
For reference, here's what I would have done in case no such CMS module existed.
Create a database with a table that will hold all job postings. The table should have the following columns: id, title, description, validityDate (names are self-explanatory). Add more if appropriate.
Write a script that queries the database for all current job postings using the following query: SELECT id, title FROM postings WHERE validityDate >= NOW(). To manage database connections, use the PHP PDO extension (look at its page on the PHP manual website for examples). This will return a list of all current job postings. For each result, let the script output HTML code like this: echo "$title<br />$description";, where $id, $title and $description are the variables holding the ID, title and description of the current record.
Write the post.php script that will fetch the details of the job posting with the ID specified in the id parameter.
Write another script where the client will input the details for a new posting into a form. After submission, the script should just insert the data into the table.
A client has given me a task to do that I've not done before, and so I'm looking for the best way to do it. They have a form they want users to fill in, but for one field, they want an option of thousands to be placed into three dropdown menus.
For example:
So a user will only be able to choose a Venue once they've chosen a City, only a City once they'd chosen a State. (A nice way to break up the thousands of options.)
I suppose I could this quite easily using POSTBACKs and a simple database, but I imagine that doing something with AJAX and a simple database would be the slicker solution.
Are there any other ways that this problem might be tackled? If not, does anyone have any links to tutorials or code snippets I could grab? Secondly, how long do you think it would take you to implement such a system?
I've never done this before so I'm hoping to avoid as many unforeseen pitfalls as possible. Thanks.
How about a simple jQuery Autocomplete solution?
I've done such a thing, also with several thousands of entries.
The problems:
it's difficult for the end user to navigate trough the list if there are hundreds of cities to choose
dropdowns as they are terrible for such things
querying a database to obtain info is stressful because the query is basically the same, with same results, nearly never-changing.
So on to solutions:
I still stood by dropdowns, but I added (trough UI) options for users to filter the list a bit. I won't post the code or the layout, if you are fine with the dropdowns as they are - keep them.
I loaded all of the countries, cities and areas via JS once. Now, why - first off, it wasn't that huge of a deal, it was about 20ish kilobytes gzipped if I'm not mistaken. I didn't want the "please choose a country" > "please wait, loading cities" > "choose a city" > "please wait, loading areas" > "choose an area" thing, I absolutely hate waiting so I don't want anyone to wait if they don't have to :)
So, the whole structure is loaded at once (when page is requested) and kept inside an object. If the browser supports sessionStorage, I check whether I have the object there in the first place - if not, I load it via jQuery's $.ajax call.
On the web server, the script returning JSON object actually loads the data from Memcache. If there's no entry in the Memcache, then I query the db and load all the data and I store it with Memcache for later use.
Now, what happens is that I've got a JS object representing all countries, cities and areas - with relations, meaning I can render the dropdowns in any way I need to, showing only relevant cities for current country selection.
Now, as you have similar structure - you can apply the same logic.
Load the item when the page loads, but check if you have sessionStorage available. If yes, check if you got object there. No? Do a $.ajax call and obtain it. When dropdowns fire change event, render the appropriate data.
Hopefully this helps a little, I'm typing this in a rush :)
A few responses:
This is a good use of AJAX, no need to look for another method. You wouldn't want to force the client to pre-load all of the javascript arrays for the possible state/city/theater combinations...
jQuery Autocomplete is a good tool to use to implement the UI
The list of cities and states can be obtained from GeoNames
How long it would take to implement depends on the skill of the implementer ;)
Somewhat working example: http://jsfiddle.net/rA9gU/36/
Hope this might help
UPDATE: Added the NO theater found near you option
http://jsfiddle.net/rA9gU/39/
You've got it. On the "on change" event for each dropdown, run an AJAX request for the options for the next dropdown.
With jQuery it's pretty simple.
$(document).ready(function () {
$("#state").change(function () {
// AJAX call w/ $.get or $.post to a script to return and set city options
});
// Same for city to retrieve cinema options
....
});
jQuery is by no means a requirement -- just wraps things up nicely and in cross-browser fashion.
Be happy to provide a more specific example if you like.
I am creating websites via Zend Framework and I've been wondering about this for quite some time now...
Imagine that you have created the best articles module and you usually add meta_keywords/meta_description database entries per article, so that when the view renders it populates the meta fields in question with the data entered in the administration back-end.
However, imagine the case where you have less dynamic content, and so far you are using the HeadMeta() view helper to add meta keywords/meta description to the page.
I would like to have a way to configure meta keywords/meta description or some other meta elements per page in the database. I've been scratching my head on what is the best solution over this, without adding an excessive overhead (since you would be needing to perform a query for every action that takes place in your website)
My initial thought was to save the meta attributes on a index in the database so that for each action you could quickly retrieve all relevant data. I quickly realized that parameters passed via GET/POST could change the result provided making the result-set irrelevant.
So maybe we could add the parameters as well, but you might want to ignore a few at the same time (since there is no need to take into consideration a ?page=12 parameter...). Maybe adding another varchar column in the index with the serialized parameters?
Or adding the entire URL and perform a REGEXP select instead of a regular select? (I am guessing that this would probably be the slowest solution...)
Also take note that mySQL has a limit on UTF-8 Indexes of about varchar(200) (thus one huge URL could not be saved)
Has anyone thought of a good way of solving this?
It sounds to me like the data structure is right: meta keywords/description need to be per-article.
Ultimately, you need to get articles from the db - whether it is a single article or a group of "best" articles. So seems to me that the key is to keep that maximally performant with some kind of server-side caching.
Typically I use a service class (see sample) that is configured with the db connection and also caches the data it retrieves. Cache lifetime can be set short enough so that even cached-data is "fresh enough". Alternatively, you clear/populate the cache via cron so that front-end requests always get a cache hit. Or you can set the cache lifetime to be forever and only clear/populate the cache on update in the admin side; the viability of this approach depends upon the frequency of update.
After you've got the data, it's jamming the values into the HeadMeta view-helper.
I have a page that, when accessed displays a table of information related to a video:
Embed code
Title
Description
Current gallery
Thumbnail image
This information is read-only when the page is first accessed.
There is a select menu that has the following options:
Edit Description
Create Thumbnail (Upload/Replace)
Edit embed code
Change Gallery
Delete video
When the user selects an option, the same initial table of data is displayed, but the relevant form input is displayed where necessary.
For example, if "Edit Description" is selected, the page reloads and the description text is replaced with a text input. If "Create Thumbnail" is selected, then a file upload input is displayed.
The idea is to display all of the information together but to limit how much can be edited at a time.
I know the state pattern is a possible solution, since each piece of data can be in atleast one of two states:
Display State
Form input state
But, my question is, would using the state pattern be overkill?
At the moment, each time the page is accessed, each part of the form decides with a switch statement whether it should be in 'display' or 'input' state and then acts accordingly. I wonder if implementing the state pattern design would make altering the form and creating similar forms easier down the road.
Thanks!
No, the state design pattern isn't overkill. It's probably a very good choice of algorithm for handling such a complex interface. I've used state engines in PHP several times; it helps you think creatively about the problem and you often get a bonus in flexibility.
I wish more programmers knew of such things.
The more I use design patterns, including the State pattern in PHP, the more I'm convinced that they save time. Initially, it may take longer to develop, but not much longer. However, when it comes to change and update, they save huge amounts of time. Your code is better organized, clearer and less likely to through a bomb into your code that you get with the tight binding outside of design patterns. I've done several PHP design patterns at php5dp.com, but, nothing in a State dp.
I'm a hobbyist, and started learning PHP last September solely to build a hobby website that I had always wished and dreamed another more competent person might make.
I enjoy programming, but I have little free time and enjoy a wide range of other interests and activities.
I feel learning PHP alone can probably allow me to create 98% of the desired features for my site, but that last 2% is awfully appealing:
The most powerful tool of the site is an advanced search page that picks through a 1000+ record game scenario database. Users can data-mine to tremendous depths - this advanced page has upwards of 50 different potential variables. It's designed to allow the hardcore user to search on almost any possible combination of data in our database and it works well. Those who aren't interested in wading through the sea of options may use the Basic Search, which is comprised of the most popular parts of the Advanced search.
Because the advanced search is so comprehensive, and because the database is rather small (less than 1,200 potential hits maximum), with each variable you choose to include the likelihood of getting any qualifying results at all drops dramatically.
In my fantasy land where I can wield AJAX as if it were Excalibur, my users would have a realtime Total Results counter in the corner of their screen as they used this page, which would automatically update its query structure and report how many results will be displayed with the addition of each variable. In this way it would be effortless to know just how many variables are enough, and when you've gone and added one that zeroes out the results set.
A somewhat similar implementation, at least visually, would be the Subtotal sidebar when building a new custom computer on IBuyPower.com
For those of you actually still reading this, my question is really rather simple:
Given the time & ability constraints outlined above, would I be able to learn just enough AJAX (or whatever) needed to pull this one feature off without too much trouble? would I be able to more or less drop-in a pre-written code snippet and tweak to fit? or should I consider opening my code up to a trusted & capable individual in the future for this implementation? (assuming I can find one...)
Thank you.
This is a great project for a beginner to tackle.
First I'd say look into using a library like jquery (jquery.com). It will simplify the javascript part of this and the manual is very good.
What you're looking to do can be broken down into a few steps:
The user changes a field on the
advanced search page.
The user's
browser collects all the field
values and sends them back to the
server.
The server performs a
search with the values and returns
the number of results
The user's
browser receives the number of
results and updates the display.
Now for implementation details:
This can be accomplished with javascript events such as onchange and onfocus.
You could collect the field values into a javascript object, serialize the object to json and send it using ajax to a php page on your server.
The server page (in php) will read the json object and use the data to search, then send back the result as markup or text.
You can then display the result directly in the browser.
This may seem like a lot to take in but you can break each step down further and learn about the details bit by bit.
Hard to answer your question without knowing your level of expertise, but check out this short description of AJAX: http://blog.coderlab.us/rasmus-30-second-ajax-tutorial
If this makes some sense then your feature may be within reach "without too much trouble". If it seems impenetrable, then probably not.